From 150a88a9c9ac9477b9ec7f9a0620207ea8837dac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Pablo=20Garc=C3=ADa=20Santamar=C3=ADa?=
 <69808296+PGSCOM@users.noreply.github.com>
Date: Wed, 8 Jul 2026 17:13:39 +0200
Subject: [PATCH] Cambio a Videojs v10

---
 FORMATO.md                      |  15 +-
 package-lock.json               | 420 ++++++++++++++++++++++++++++----
 package.json                    |   4 +-
 src/scripts/proyecto-video.js   |  54 ++--
 src/styles/proyecto-detalle.css |  47 +---
 5 files changed, 420 insertions(+), 120 deletions(-)

diff --git a/FORMATO.md b/FORMATO.md
index 397ec5f..66ece9b 100644
--- a/FORMATO.md
+++ b/FORMATO.md
@@ -135,7 +135,9 @@ El inline usa fondo oscuro y color lavanda. Los bloques de código heredan el mi
 
 ## 9. Vídeos
 
-Los vídeos del cuerpo se renderizan con **Plyr**, un reproductor personalizado con controles, barra de progreso, volumen y pantalla completa.
+Los vídeos del cuerpo se renderizan con **Video.js v10**, un reproductor personalizado con controles, barra de progreso, volumen y pantalla completa.
+
+Escribe directamente `<video>` con el atributo `src` — el script lo envuelve automáticamente en los Web Components de Video.js:
 
 ### Vídeo local (archivo MP4)
 
@@ -147,18 +149,21 @@ Coloca el archivo en `src/assets/proyectos/` para que Astro lo procese.
 
 ### YouTube / Vimeo (embed automático)
 
-Plyr detecta la URL y carga el iframe automáticamente con su backend:
+Video.js detecta la URL y carga el iframe automáticamente:
 
 ```html
 <video src="https://www.youtube.com/watch?v=VIDEO_ID" controls></video>
 <video src="https://vimeo.com/VIDEO_ID" controls></video>
 ```
 
-Si prefieres la sintaxis explícita con `data-plyr-provider`:
+También puedes usar la sintaxis nativa de Web Components si prefieres ser explícito:
 
 ```html
-<div data-plyr-provider="youtube" data-plyr-embed-id="dQw4w9WgXcQ"></div>
-<div data-plyr-provider="vimeo" data-plyr-embed-id="76979871"></div>
+<video-player>
+  <video-skin>
+    <video src="../../assets/proyectos/mi-video.mp4" controls playsinline></video>
+  </video-skin>
+</video-player>
 ```
 
 Los vídeos se muestran redondeados con sombra, igual que las imágenes.
diff --git a/package-lock.json b/package-lock.json
index 02793a4..485292e 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,10 +9,10 @@
       "version": "0.0.1",
       "dependencies": {
         "@astrojs/mdx": "^4.3.14",
+        "@videojs/html": "^10.0.0-beta.25",
         "astro": "^5.15.1",
         "gsap": "^3.15.0",
-        "lenis": "^1.3.23",
-        "plyr": "^3.8.4"
+        "lenis": "^1.3.23"
       },
       "optionalDependencies": {
         "@esbuild/linux-x64": "0.25.10"
@@ -1069,6 +1069,30 @@
       "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
       "license": "MIT"
     },
+    "node_modules/@lit-labs/ssr-dom-shim": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/@lit-labs/ssr-dom-shim/-/ssr-dom-shim-1.6.0.tgz",
+      "integrity": "sha512-VHb0ALPMTlgKjM6yIxxoQNnpKyUKLD04VzeQdsiXkMqkvYlAHxq9glGLmgbb889/1GsohSOAjvQYoiBppXFqrQ==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@lit/context": {
+      "version": "1.1.6",
+      "resolved": "https://registry.npmjs.org/@lit/context/-/context-1.1.6.tgz",
+      "integrity": "sha512-M26qDE6UkQbZA2mQ3RjJ3Gzd8TxP+/0obMgE5HfkfLhEEyYE3Bui4A5XHiGPjy0MUGAyxB3QgVuw2ciS0kHn6A==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@lit/reactive-element": "^1.6.2 || ^2.1.0"
+      }
+    },
+    "node_modules/@lit/reactive-element": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/@lit/reactive-element/-/reactive-element-2.1.2.tgz",
+      "integrity": "sha512-pbCDiVMnne1lYUIaYNN5wrwQXDtHaYtg7YEFPeW+hws6U47WeFvISGUWekPGKWOP1ygrs0ef0o1VJMk1exos5A==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@lit-labs/ssr-dom-shim": "^1.5.0"
+      }
+    },
     "node_modules/@mdx-js/mdx": {
       "version": "3.1.1",
       "resolved": "https://registry.npmjs.org/@mdx-js/mdx/-/mdx-3.1.1.tgz",
@@ -1493,6 +1517,129 @@
       "integrity": "sha512-83yeghZ2xxin3Nj8z1NMd/NCuca+gsYXswywDy5bHvwlWL8tpTQmzGeUuHd9FC3E/SBEMvzJRwWEOz5gGes9Qg==",
       "license": "MIT"
     },
+    "node_modules/@svta/cml-608": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@svta/cml-608/-/cml-608-1.0.2.tgz",
+      "integrity": "sha512-ZEJ68330gcLKfvVv6Qifr1HR7+GldDUxzkjqSbqRK7jHtHSLSV1JAyDwlYe8+C7ABuY1bp8MpgJ4/Gg+jl+pLQ==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/@svta/cml-cmcd": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/@svta/cml-cmcd/-/cml-cmcd-2.3.2.tgz",
+      "integrity": "sha512-SKBBjLmci0WK8HMjuv+36tVIMktonoOoxsXblOFZmB+ePPV2zjRMTD+2ZmE/1VEPJkKHENyhSjSHgJyeOlvZ1A==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "@svta/cml-structured-field-values": "1.1.3",
+        "@svta/cml-utils": "1.5.0"
+      }
+    },
+    "node_modules/@svta/cml-cmsd": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/@svta/cml-cmsd/-/cml-cmsd-1.0.6.tgz",
+      "integrity": "sha512-LUORV6bb0TbU4rSC2HoPqUCix1igLrXkRQXWiIyJo2OMzb14kAK/1jsW0mzY6up6w1GrjKQcjc6OwqJdo/zd/g==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "@svta/cml-cta": "1.0.6",
+        "@svta/cml-structured-field-values": "1.1.3",
+        "@svta/cml-utils": "1.5.0"
+      }
+    },
+    "node_modules/@svta/cml-cta": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/@svta/cml-cta/-/cml-cta-1.0.6.tgz",
+      "integrity": "sha512-l13/4myTX1EbRd38nY8J1umVY5UdR/nZO6CeKqVLXnMMIayg7/fu0TueZckjTA9Loal55MGK1xbHnXVjz7OUUw==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "@svta/cml-structured-field-values": "1.1.3",
+        "@svta/cml-utils": "1.5.0"
+      }
+    },
+    "node_modules/@svta/cml-dash": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/@svta/cml-dash/-/cml-dash-1.0.6.tgz",
+      "integrity": "sha512-4XtHYlPrzL/dRe/8XmRQoLnTo9S86tISgrl67eUqKl5MtNTpZBYTncuPrspslPZPZROBBWNrBuepYfYUtU9CKA==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "@svta/cml-utils": "1.5.0"
+      }
+    },
+    "node_modules/@svta/cml-id3": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/@svta/cml-id3/-/cml-id3-1.0.6.tgz",
+      "integrity": "sha512-63j8gkAnPOmOBWlp0hIZPvsIioZttdbg6/TgwITqMYbSLYVJ+6QGa/UtIP0I84NsfstANw6QdCn7i8SS08kn1A==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "@svta/cml-utils": "1.5.0"
+      }
+    },
+    "node_modules/@svta/cml-request": {
+      "version": "1.0.12",
+      "resolved": "https://registry.npmjs.org/@svta/cml-request/-/cml-request-1.0.12.tgz",
+      "integrity": "sha512-4sJvnnoNpq58j2mCGP8k+MF6wVy/qa4gbt6kfT1dPIKmn3mPxw+JVfilhcWsUi+peK2yCZxOJJYyHj1cAcQE1w==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "@svta/cml-cmcd": "2.3.2",
+        "@svta/cml-utils": "1.5.0",
+        "@svta/cml-xml": "1.1.4"
+      }
+    },
+    "node_modules/@svta/cml-structured-field-values": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@svta/cml-structured-field-values/-/cml-structured-field-values-1.1.3.tgz",
+      "integrity": "sha512-XqLzQOTznz6kh/nsSh8dy1kV7GQjL4csG+2U5EvLGhAqNuNUczbVg5EAsDobKDVg8xhdthdXx2UuwM+ZHQCxSg==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "@svta/cml-utils": "1.5.0"
+      }
+    },
+    "node_modules/@svta/cml-utils": {
+      "version": "1.5.0",
+      "resolved": "https://registry.npmjs.org/@svta/cml-utils/-/cml-utils-1.5.0.tgz",
+      "integrity": "sha512-JMqclD7Akd+GSJiuaYNUHOP2wNtf/nauKeszlYeivSHfi0Lp3pmSW5PXDvJ2dO4aPmmSOQbF0ztTsW9Vcs2Whw==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/@svta/cml-xml": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/@svta/cml-xml/-/cml-xml-1.1.4.tgz",
+      "integrity": "sha512-jbixqjiJIc16SGxylHwiOzO+DuhkGfuP+fJ9AHeVJKdFDKnabgfCDpnp6dvZpZnjMj4nHvzVtuUV7RISPIwYXw==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=20"
+      },
+      "peerDependencies": {
+        "@svta/cml-utils": "1.5.0"
+      }
+    },
     "node_modules/@types/debug": {
       "version": "4.1.12",
       "resolved": "https://registry.npmjs.org/@types/debug/-/debug-4.1.12.tgz",
@@ -1568,6 +1715,90 @@
       "integrity": "sha512-WmoN8qaIAo7WTYWbAZuG8PYEhn5fkz7dZrqTBZ7dtt//lL2Gwms1IcnQ5yHqjDfX8Ft5j4YzDM23f87zBfDe9g==",
       "license": "ISC"
     },
+    "node_modules/@videojs/core": {
+      "version": "10.0.0-beta.25",
+      "resolved": "https://registry.npmjs.org/@videojs/core/-/core-10.0.0-beta.25.tgz",
+      "integrity": "sha512-Yxd6c+u7LrYl6aKzZRyR5PjDqUt1lUbgFwIhg6pMzI8bJszIGjLS7TDzXdALpEFJpM1Z08dbqCEzCGaMj7Eu6A==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@videojs/spf": "10.0.0-beta.25",
+        "@videojs/store": "10.0.0-beta.25",
+        "@videojs/utils": "10.0.0-beta.25",
+        "@vimeo/player": "^2.30.3",
+        "dashjs": "^5.2.0",
+        "hls.js": "^1.6.7",
+        "mux-embed": "^5.17.10"
+      }
+    },
+    "node_modules/@videojs/element": {
+      "version": "10.0.0-beta.25",
+      "resolved": "https://registry.npmjs.org/@videojs/element/-/element-10.0.0-beta.25.tgz",
+      "integrity": "sha512-TAa0+89mDj+4JEv2F87EG3hEqDqZJMWP/treRzQaC1lR0eeGremaVUfdxNNnyLe/e797dXSWtiu5Q5A1Yka5Qw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@lit/context": "^1.1.0"
+      }
+    },
+    "node_modules/@videojs/html": {
+      "version": "10.0.0-beta.25",
+      "resolved": "https://registry.npmjs.org/@videojs/html/-/html-10.0.0-beta.25.tgz",
+      "integrity": "sha512-7qYMJf9Wbu3AF1ZxuEWUw0NBY9pX9yKtaokPhLfBJQc4BO+1xSQu27cqnLjZbuZqnaRpwN0P3+TZ5qYWytfmpQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@videojs/core": "10.0.0-beta.25",
+        "@videojs/element": "10.0.0-beta.25",
+        "@videojs/spf": "10.0.0-beta.25",
+        "@videojs/store": "10.0.0-beta.25",
+        "@videojs/utils": "10.0.0-beta.25"
+      }
+    },
+    "node_modules/@videojs/spf": {
+      "version": "10.0.0-beta.25",
+      "resolved": "https://registry.npmjs.org/@videojs/spf/-/spf-10.0.0-beta.25.tgz",
+      "integrity": "sha512-SETOzCPbSxuzCoX+bF2u7/Z80AA/Xwpqpy5ki//yslIyPxWkMT0GFydXdoZ/bJpNsBqGmDbDxEBDo1uMjnM4mQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@videojs/utils": "10.0.0-beta.25",
+        "signal-polyfill": "^0.2.2"
+      }
+    },
+    "node_modules/@videojs/store": {
+      "version": "10.0.0-beta.25",
+      "resolved": "https://registry.npmjs.org/@videojs/store/-/store-10.0.0-beta.25.tgz",
+      "integrity": "sha512-XvPC0+MQ6AZ/oKGpSzmjOM56aYESMpPsTg5zddBDXhcqeAOUxpEsXDqhU1rsm751tU4ZavGxHENx70lBOa5dUA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@videojs/utils": "10.0.0-beta.25"
+      },
+      "peerDependencies": {
+        "@videojs/element": "10.0.0-beta.25",
+        "react": "^18.0.0 || ^19.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@videojs/element": {
+          "optional": true
+        },
+        "react": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@videojs/utils": {
+      "version": "10.0.0-beta.25",
+      "resolved": "https://registry.npmjs.org/@videojs/utils/-/utils-10.0.0-beta.25.tgz",
+      "integrity": "sha512-tq/848qmzgTncopeYE5iiYs1Pfzj4OEdSe7zE2H6xoOB0PUMlnPOThA3aybHJ8Lh9bmw+wTb6QJ0NZanIzt2Zg==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@vimeo/player": {
+      "version": "2.30.4",
+      "resolved": "https://registry.npmjs.org/@vimeo/player/-/player-2.30.4.tgz",
+      "integrity": "sha512-M8m1UAhJSb+KCWuXDLWHViwj+3YY/0ogwFquRfMHs9e9LYjXT9iB7n+sOCKwUusbiXuU2HKmXx+FEGHtYZfUSg==",
+      "license": "MIT",
+      "dependencies": {
+        "native-promise-only": "0.8.1",
+        "weakmap-polyfill": "2.0.4"
+      }
+    },
     "node_modules/acorn": {
       "version": "8.15.0",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
@@ -1833,6 +2064,16 @@
       "integrity": "sha512-kwDPIFCGx0NZHog36dj+tHiwP4QMzsZ3AgMViUBKI0+V5n4U0ufTCUMhnQ04diaRI8EX/QcPfql7zlhZ7j4zgg==",
       "license": "MIT"
     },
+    "node_modules/bcp-47-match": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/bcp-47-match/-/bcp-47-match-2.0.3.tgz",
+      "integrity": "sha512-JtTezzbAibu8G0R9op9zb3vcWZd9JF6M0xOYGPn0fNCd7wOpRB1mU2mH9T8gaBGbAAyIIVgB2G7xG0GP98zMAQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/boolbase": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
@@ -1986,6 +2227,12 @@
         "node": ">=6"
       }
     },
+    "node_modules/codem-isoboxer": {
+      "version": "0.3.10",
+      "resolved": "https://registry.npmjs.org/codem-isoboxer/-/codem-isoboxer-0.3.10.tgz",
+      "integrity": "sha512-eNk3TRV+xQMJ1PEj0FQGY8KD4m0GPxT487XJ+Iftm7mVa9WpPFDMWqPt+46buiP5j5Wzqe5oMIhqBcAeKfygSA==",
+      "license": "MIT"
+    },
     "node_modules/collapse-white-space": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/collapse-white-space/-/collapse-white-space-2.1.0.tgz",
@@ -2040,17 +2287,6 @@
       "integrity": "sha512-+W7VmiVINB+ywl1HGXJXmrqkOhpKrIiVZV6tQuV54ZyQC7MMuBt81Vc336GMLoHBq5hV/F9eXgt5Mnx0Rha5Fg==",
       "license": "MIT"
     },
-    "node_modules/core-js": {
-      "version": "3.49.0",
-      "resolved": "https://registry.npmjs.org/core-js/-/core-js-3.49.0.tgz",
-      "integrity": "sha512-es1U2+YTtzpwkxVLwAFdSpaIMyQaq0PBgm3YD1W3Qpsn1NAmO3KSgZfu+oGSWVu6NvLHoHCV/aYcsE5wiB7ALg==",
-      "hasInstallScript": true,
-      "license": "MIT",
-      "funding": {
-        "type": "opencollective",
-        "url": "https://opencollective.com/core-js"
-      }
-    },
     "node_modules/crossws": {
       "version": "0.3.5",
       "resolved": "https://registry.npmjs.org/crossws/-/crossws-0.3.5.tgz",
@@ -2146,11 +2382,30 @@
       "integrity": "sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==",
       "license": "CC0-1.0"
     },
-    "node_modules/custom-event-polyfill": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/custom-event-polyfill/-/custom-event-polyfill-1.0.7.tgz",
-      "integrity": "sha512-TDDkd5DkaZxZFM8p+1I3yAlvM3rSr1wbrOliG4yJiwinMZN8z/iGL7BTlDkrJcYTmgUSb4ywVCc3ZaUtOtC76w==",
-      "license": "MIT"
+    "node_modules/dashjs": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/dashjs/-/dashjs-5.2.0.tgz",
+      "integrity": "sha512-2W2KHFN53Sk7+rtdnIfSUK/3Oov+hraMTeVZwDOTSCNKM1cQtFiJdblNzRMnl59a/QDseG7JW+PC9mh/B+CMcg==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@svta/cml-608": "1.0.2",
+        "@svta/cml-cmcd": "2.3.2",
+        "@svta/cml-cmsd": "1.0.6",
+        "@svta/cml-dash": "1.0.6",
+        "@svta/cml-id3": "1.0.6",
+        "@svta/cml-request": "1.0.12",
+        "@svta/cml-xml": "1.1.4",
+        "bcp-47-match": "^2.0.3",
+        "codem-isoboxer": "0.3.10",
+        "fast-deep-equal": "3.1.3",
+        "html-entities": "^2.6.0",
+        "imsc": "^1.1.5",
+        "localforage": "^1.10.0",
+        "path-browserify": "^1.0.1"
+      },
+      "engines": {
+        "node": ">=20"
+      }
     },
     "node_modules/debug": {
       "version": "4.4.3",
@@ -2547,6 +2802,12 @@
       "integrity": "sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==",
       "license": "MIT"
     },
+    "node_modules/fast-deep-equal": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+      "license": "MIT"
+    },
     "node_modules/fdir": {
       "version": "6.5.0",
       "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
@@ -2881,6 +3142,28 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/hls.js": {
+      "version": "1.6.16",
+      "resolved": "https://registry.npmjs.org/hls.js/-/hls.js-1.6.16.tgz",
+      "integrity": "sha512-VSIRpLfRwlAAdGL4wiTucx2ScRipo0ed1FBatWkyt832jC4CReKstga6yIhYVwGu9LOBjuX9wzmRMeQdBJtzEA==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/html-entities": {
+      "version": "2.6.0",
+      "resolved": "https://registry.npmjs.org/html-entities/-/html-entities-2.6.0.tgz",
+      "integrity": "sha512-kig+rMn/QOVRvr7c86gQ8lWXq+Hkv6CbAH1hLu+RG338StTpE8Z0b44SDVaqVu7HGKf27frdmUYEs9hTUX/cLQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/mdevils"
+        },
+        {
+          "type": "patreon",
+          "url": "https://patreon.com/mdevils"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/html-escaper": {
       "version": "3.0.3",
       "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-3.0.3.tgz",
@@ -2903,6 +3186,12 @@
       "integrity": "sha512-dTxcvPXqPvXBQpq5dUr6mEMJX4oIEFv6bwom3FDwKRDsuIjjJGANqhBuoAn9c1RQJIdAKav33ED65E2ys+87QQ==",
       "license": "BSD-2-Clause"
     },
+    "node_modules/immediate": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/immediate/-/immediate-3.0.6.tgz",
+      "integrity": "sha512-XXOFtyqDjNDAQxVfYxuF7g9Il/IbWmmlQg2MYKOH8ExIT1qg6xc4zyS3HaEEATgs1btfzxq15ciUiY7gjSXRGQ==",
+      "license": "MIT"
+    },
     "node_modules/import-meta-resolve": {
       "version": "4.2.0",
       "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.2.0.tgz",
@@ -2913,6 +3202,21 @@
         "url": "https://github.com/sponsors/wooorm"
       }
     },
+    "node_modules/imsc": {
+      "version": "1.1.5",
+      "resolved": "https://registry.npmjs.org/imsc/-/imsc-1.1.5.tgz",
+      "integrity": "sha512-V8je+CGkcvGhgl2C1GlhqFFiUOIEdwXbXLiu1Fcubvvbo+g9inauqT3l0pNYXGoLPBj3jxtZz9t+wCopMkwadQ==",
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "sax": "1.2.1"
+      }
+    },
+    "node_modules/imsc/node_modules/sax": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.1.tgz",
+      "integrity": "sha512-8I2a3LovHTOpm7NV5yOyO8IHqgVsfK4+UuySrXU8YXkSRX7k6hCV9b3HrkKCr3nMpgj+0bmocaJJWpvp1oc7ZA==",
+      "license": "ISC"
+    },
     "node_modules/inline-style-parser": {
       "version": "0.2.7",
       "resolved": "https://registry.npmjs.org/inline-style-parser/-/inline-style-parser-0.2.7.tgz",
@@ -3084,11 +3388,23 @@
         }
       }
     },
-    "node_modules/loadjs": {
-      "version": "4.3.0",
-      "resolved": "https://registry.npmjs.org/loadjs/-/loadjs-4.3.0.tgz",
-      "integrity": "sha512-vNX4ZZLJBeDEOBvdr2v/F+0aN5oMuPu7JTqrMwp+DtgK+AryOlpy6Xtm2/HpNr+azEa828oQjOtWsB6iDtSfSQ==",
-      "license": "MIT"
+    "node_modules/lie": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/lie/-/lie-3.1.1.tgz",
+      "integrity": "sha512-RiNhHysUjhrDQntfYSfY4MU24coXXdEOgw9WGcKHNeEwffDYbF//u87M1EWaMGzuFoSbqW0C9C6lEEhDOAswfw==",
+      "license": "MIT",
+      "dependencies": {
+        "immediate": "~3.0.5"
+      }
+    },
+    "node_modules/localforage": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/localforage/-/localforage-1.10.0.tgz",
+      "integrity": "sha512-14/H1aX7hzBBmmh7sGPd+AOMkkIrHM3Z1PAyGgZigA1H1p5O5ANnMyWzvpAETtG68/dC4pC0ncy3+PPGzXZHPg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "lie": "3.1.1"
+      }
     },
     "node_modules/longest-streak": {
       "version": "3.1.0",
@@ -4191,6 +4507,12 @@
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
       "license": "MIT"
     },
+    "node_modules/mux-embed": {
+      "version": "5.18.1",
+      "resolved": "https://registry.npmjs.org/mux-embed/-/mux-embed-5.18.1.tgz",
+      "integrity": "sha512-ePsHjiEKY+FgrSBiMmaF+LOtTQSSBWv/1zqpREQFN96JE93xlsArT/MEi30yKOE06MgjOlL70YI750molu3y7g==",
+      "license": "MIT"
+    },
     "node_modules/nanoid": {
       "version": "3.3.11",
       "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.11.tgz",
@@ -4209,6 +4531,12 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/native-promise-only": {
+      "version": "0.8.1",
+      "resolved": "https://registry.npmjs.org/native-promise-only/-/native-promise-only-0.8.1.tgz",
+      "integrity": "sha512-zkVhZUA3y8mbz652WrL5x0fB0ehrBkulWT3TomAQ9iDtyXZvzKeEA6GPxAItBYeNYl5yngKRX612qHOhvMkDeg==",
+      "license": "MIT"
+    },
     "node_modules/neotraverse": {
       "version": "0.6.18",
       "resolved": "https://registry.npmjs.org/neotraverse/-/neotraverse-0.6.18.tgz",
@@ -4402,6 +4730,12 @@
         "url": "https://github.com/inikulin/parse5?sponsor=1"
       }
     },
+    "node_modules/path-browserify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/path-browserify/-/path-browserify-1.0.1.tgz",
+      "integrity": "sha512-b7uo2UCUOYZcnF/3ID0lulOJi/bafxa1xPe7ZPsammBSpjSWQkjNxlt635YGS2MiR9GjvuXCtz2emr3jbsz98g==",
+      "license": "MIT"
+    },
     "node_modules/piccolore": {
       "version": "0.1.3",
       "resolved": "https://registry.npmjs.org/piccolore/-/piccolore-0.1.3.tgz",
@@ -4426,19 +4760,6 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
-    "node_modules/plyr": {
-      "version": "3.8.4",
-      "resolved": "https://registry.npmjs.org/plyr/-/plyr-3.8.4.tgz",
-      "integrity": "sha512-DrzLbK9Wol3zeiuZCleD9aUOl0KAaBHR9H6WVVVYPZ4Ya+LYxUFTgSF1jooHcMQCv96Ws96wCaZzIoP3bES8pQ==",
-      "license": "MIT",
-      "dependencies": {
-        "core-js": "^3.45.1",
-        "custom-event-polyfill": "^1.0.7",
-        "loadjs": "^4.3.0",
-        "rangetouch": "^2.0.1",
-        "url-polyfill": "^1.1.13"
-      }
-    },
     "node_modules/postcss": {
       "version": "8.5.6",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
@@ -4514,12 +4835,6 @@
       "integrity": "sha512-b484I/7b8rDEdSDKckSSBA8knMpcdsXudlE/LNL639wFoHKwLbEkQFZHWEYwDC0wa0FKUcCY+GAF73Z7wxNVFA==",
       "license": "MIT"
     },
-    "node_modules/rangetouch": {
-      "version": "2.0.1",
-      "resolved": "https://registry.npmjs.org/rangetouch/-/rangetouch-2.0.1.tgz",
-      "integrity": "sha512-sln+pNSc8NGaHoLzwNBssFSf/rSYkqeBXzX1AtJlkJiUaVSJSbRAWJk+4omsXkN+EJalzkZhWQ3th1m0FpR5xA==",
-      "license": "MIT"
-    },
     "node_modules/readdirp": {
       "version": "5.0.0",
       "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-5.0.0.tgz",
@@ -4977,6 +5292,12 @@
         "@types/hast": "^3.0.4"
       }
     },
+    "node_modules/signal-polyfill": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/signal-polyfill/-/signal-polyfill-0.2.2.tgz",
+      "integrity": "sha512-p63Y4Er5/eMQ9RHg0M0Y64NlsQKpiu6MDdhBXpyywRuWiPywhJTpKJ1iB5K2hJEbFZ0BnDS7ZkJ+0AfTuL37Rg==",
+      "license": "Apache-2.0"
+    },
     "node_modules/sisteransi": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/sisteransi/-/sisteransi-1.0.5.tgz",
@@ -5496,12 +5817,6 @@
         }
       }
     },
-    "node_modules/url-polyfill": {
-      "version": "1.1.14",
-      "resolved": "https://registry.npmjs.org/url-polyfill/-/url-polyfill-1.1.14.tgz",
-      "integrity": "sha512-p4f3TTAG6ADVF3mwbXw7hGw+QJyw5CnNGvYh5fCuQQZIiuKUswqcznyV3pGDP9j0TSmC4UvRKm8kl1QsX1diiQ==",
-      "license": "MIT"
-    },
     "node_modules/vfile": {
       "version": "6.0.3",
       "resolved": "https://registry.npmjs.org/vfile/-/vfile-6.0.3.tgz",
@@ -5637,6 +5952,15 @@
         }
       }
     },
+    "node_modules/weakmap-polyfill": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/weakmap-polyfill/-/weakmap-polyfill-2.0.4.tgz",
+      "integrity": "sha512-ZzxBf288iALJseijWelmECm/1x7ZwQn3sMYIkDr2VvZp7r6SEKuT8D0O9Wiq6L9Nl5mazrOMcmiZE/2NCenaxw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
     "node_modules/web-namespaces": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/web-namespaces/-/web-namespaces-2.0.1.tgz",
diff --git a/package.json b/package.json
index 5f3828a..9988f90 100644
--- a/package.json
+++ b/package.json
@@ -10,10 +10,10 @@
   },
   "dependencies": {
     "@astrojs/mdx": "^4.3.14",
+    "@videojs/html": "^10.0.0-beta.25",
     "astro": "^5.15.1",
     "gsap": "^3.15.0",
-    "lenis": "^1.3.23",
-    "plyr": "^3.8.4"
+    "lenis": "^1.3.23"
   },
   "optionalDependencies": {
     "@esbuild/linux-x64": "0.25.10"
diff --git a/src/scripts/proyecto-video.js b/src/scripts/proyecto-video.js
index ff88914..dfb8b84 100644
--- a/src/scripts/proyecto-video.js
+++ b/src/scripts/proyecto-video.js
@@ -1,51 +1,47 @@
-import Plyr from 'plyr';
+import { VideoSkinElement } from '@videojs/html/video';
+import { VideoPlayerElement } from '@videojs/html/video/player';
 
-const plyrOpts = {
-  controls: ['play-large', 'play', 'progress', 'current-time', 'mute', 'volume', 'fullscreen'],
-  invertTime: false,
-  toggleInvert: false,
-  resetOnEnd: true,
-};
-
-/** Comprueba si un elemento está dentro de un panel oculto (pestaña no activa) */
+/**
+ * @param {HTMLElement} el
+ * @returns {boolean}
+ */
 function inHiddenPanel(el) {
   return !!el.closest('.pd-tab-panel[hidden]');
 }
 
-/** Inicializa Plyr en vídeos y embeds (YouTube/Vimeo) dentro de un contenedor */
-function initVideos(container = document) {
-  container.querySelectorAll('video, [data-plyr-provider]').forEach((el) => {
-    if (el.classList.contains('plyr--setup')) return;
-    // En la carga inicial saltamos los que están dentro de pestañas ocultas
-    if (container === document && inHiddenPanel(el)) return;
-    el.classList.add('plyr--setup');
-    new Plyr(el, plyrOpts);
+/**
+ * @param {HTMLVideoElement} video
+ */
+function wrapVideo(video) {
+  if (video.closest('video-player')) return;
+  const player = new VideoPlayerElement();
+  const skin = new VideoSkinElement();
+  video.replaceWith(player);
+  player.appendChild(skin);
+  skin.appendChild(video);
+}
+
+function initVideos() {
+  document.querySelectorAll('.pd-contenido video').forEach((v) => {
+    if (inHiddenPanel(v)) return;
+    wrapVideo(v);
   });
 }
 
 initVideos();
 
-// Observa cambios en el contenido para capturar vídeos que aparezcan
-// dinámicamente, sobre todo al cambiar de pestaña (hidden → visible).
 const contenido = document.querySelector('.pd-contenido');
 if (contenido) {
   const obs = new MutationObserver((mutations) => {
     for (const m of mutations) {
-      // Nuevos nodos añadidos al DOM
       if (m.type === 'childList' && m.addedNodes.length) {
-        initVideos(m.target);
+        m.target.querySelectorAll('video').forEach(wrapVideo);
         continue;
       }
-      // Un panel oculto se ha hecho visible → inicializar sus vídeos
       if (m.type === 'attributes' && m.attributeName === 'hidden' && !m.target.hidden) {
-        initVideos(m.target);
+        m.target.querySelectorAll('video').forEach(wrapVideo);
       }
     }
   });
-  obs.observe(contenido, {
-    childList: true,
-    subtree: true,
-    attributes: true,
-    attributeFilter: ['hidden'],
-  });
+  obs.observe(contenido, { childList: true, subtree: true, attributes: true, attributeFilter: ['hidden'] });
 }
diff --git a/src/styles/proyecto-detalle.css b/src/styles/proyecto-detalle.css
index 053bf31..d961c5b 100644
--- a/src/styles/proyecto-detalle.css
+++ b/src/styles/proyecto-detalle.css
@@ -3,7 +3,7 @@
    Estilo cinematográfico, hermano del modal de proyectos
    ============================================ */
 
-@import 'plyr/dist/plyr.css';
+@import '@videojs/html/video/skin.css';
 
 :root {
   --pd-azul: #93c5fd;
@@ -670,42 +670,17 @@ body:has(.pd-page) {
   }
 }
 
-/* ── Plyr (reproductor de vídeo) ─────────────────────── */
-.pd-contenido .plyr {
+/* ── Video.js v10 (reproductor de vídeo) ─────────────── */
+.pd-contenido video-player,
+.pd-contenido video-skin {
+  display: block;
+}
+
+.pd-contenido video-skin {
+  --media-border-radius: 12px;
+  --media-color-primary: #93c5fd;
+  margin: 16px 0;
   border-radius: 12px;
   overflow: hidden;
-  margin: 16px 0;
   box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
 }
-
-.pd-contenido .plyr--video {
-  background: #000;
-}
-
-.pd-contenido .plyr__controls {
-  background: linear-gradient(transparent, rgba(5, 7, 13, 0.85));
-  padding-bottom: 8px;
-}
-
-.pd-contenido .plyr__control--overlaid {
-  background: rgba(147, 197, 253, 0.9);
-  border: none;
-}
-
-.pd-contenido .plyr__control--overlaid:hover {
-  background: var(--pd-azul);
-}
-
-.pd-contenido .plyr--full-ui input[type='range'] {
-  color: var(--pd-azul);
-}
-
-.pd-contenido .plyr__progress__buffer {
-  background: rgba(255, 255, 255, 0.15);
-}
-
-.pd-contenido .plyr__tooltip {
-  background: rgba(5, 7, 13, 0.9);
-  color: #fff;
-  font-size: 0.8rem;
-}