/* Landing de Vídeos — reutiliza el diseño de Proyectos (proyecto.css).
   Aquí solo los extras: reset de botones, carátula con play y lightbox. */

/* Chips: <button> que reusan .pjchip */
.pjfilter .pjchip{font-family:inherit;cursor:pointer}
.pjfilter .pjchip:hover{color:var(--ink) !important;border-color:var(--ink)}
.pjfilter .pjchip.is-active,.pjfilter .pjchip.is-active:hover{color:#fff !important;background:var(--g);border-color:var(--g)}
.pjfilter .pjchip:focus{outline:none}

/* Tarjetas: <button> que reusan .pjcard. Reset completo + anular azul de Astra. */
.pjcard--video,
.pjcard--video:hover,
.pjcard--video:focus,
.pjcard--video:active{background:none !important;border:0;padding:0;width:100%;text-align:left;font-family:inherit;cursor:pointer;outline:none;color:var(--ink) !important}
.pjcard--video .pjcard__t{transition:color .15s}
.pjcard--video:hover .pjcard__t{color:var(--g) !important}
.pjcard--video .pjcard__s{color:var(--mut)}

/* Miniatura 16:9 (recorta las bandas negras del thumbnail 4:3 de YouTube). */
.pjcard--video .pjcard__im{position:relative;aspect-ratio:16/9}
.pjcard--video .pjcard__im img{width:100%;height:100%;object-fit:cover}

/* Botón de play centrado sobre la carátula */
.vplay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;pointer-events:none}
.vplay::before{content:"";position:absolute;width:64px;height:64px;border-radius:50%;background:rgba(0,0,0,.5);transition:.2s}
.vplay svg{position:relative;width:26px;height:26px;color:#fff;margin-left:3px}
.pjcard--video:hover .vplay::before{background:var(--g);transform:scale(1.08)}

/* Lightbox del reproductor */
.vlb{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center;padding:24px;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s}
.vlb.is-open{opacity:1;visibility:visible}
.vlb__box{position:relative;width:100%;max-width:980px;aspect-ratio:16/9}
.vlb__box iframe{width:100%;height:100%;border:0;border-radius:14px;background:#000}
/* Cierre: círculo blanco de alto contraste, fijo arriba-derecha, por encima de todo. */
.vlb__close{position:fixed;top:16px;right:16px;z-index:2147483000;width:50px;height:50px;border:0;background:#fff;color:#14150f;border-radius:50%;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(0,0,0,.45);transition:transform .15s,background .15s}
.vlb__close:hover{background:#eef0ec;transform:scale(1.06)}
.vlb__close svg{width:26px;height:26px;stroke-width:2.4;stroke:#14150f !important;color:#14150f !important}
.vlb__close{color:#14150f !important;background:#fff !important;padding:0 !important;min-width:0 !important}