/* Base */
.jp-video-block { position: relative; width: 100%; background: #000; }
.jp-video-block::before { content:""; display:block; padding-bottom: var(--jp-pb, 56.25%); }
.jp-video-block .jp-vimeo-frame { position:absolute; inset:0; z-index:1; }
.jp-vimeo-wrap iframe { width:100%; height:100%; border:0; }
.jp-vimeo-wrap > iframe:not([data-jpvimeo="1"]) { display: none !important; }

/* Capa d'enllaç a tota la peça */
.jp-vimeo-link {
  position:absolute; inset:0; z-index:6;
  display:block; text-indent:-9999px; background:transparent; border:0;
  pointer-events:auto;
}
.jp-vimeo-link.is-disabled { pointer-events:none; }

/* Overlay Play (click-through quan cal) */
.jp-vimeo-overlay {
  position:absolute; inset:0;
  display:none; align-items:center; justify-content:center;
  border:0; background:transparent; z-index:4;
  transition: opacity .25s ease;
}
.jp-vimeo-overlay.is-visible { display:flex; }
.jp-vimeo-overlay.clickthrough { pointer-events: none !important}
.jp-vimeo-overlay.is-hidden { opacity:0; }
.jp-vimeo-overlay::before {
  content:""; width:72px; height:72px; border-radius:9999px;
  background:rgba(255,255,255,0.95); box-shadow:0 6px 24px rgba(0,0,0,0.35);
  display:block; position:relative;
}
.jp-vimeo-overlay::after {
  content:""; position:absolute; left:50%; top:50%; transform: translate(-45%, -50%);
  width:0; height:0; border-top:13px solid transparent; border-bottom:13px solid transparent; border-left:22px solid #000;
}

/* Màscara (portada o fons negre) */
.jp-vimeo-mask {
  pointer-events:none !important;
  position:absolute; inset:0; pointer-events:none; z-index:3;
  background: transparent; opacity: 1; will-change: opacity;
  background-size: cover; background-position: center; background-repeat: no-repeat;
  transition: opacity .8s ease; /* manté el teu fade-out de 800ms */
}

/* Fades */
@keyframes jpMaskFadeOut { from { opacity: 1; } to { opacity: 0; } }

/* Manual iOS: OUT 800ms (classe per defecte) */
.jp-vimeo-mask.fade-out { animation: jpMaskFadeOut 800ms ease-out forwards; }

/* Autoplay: OUT 400ms (classe ràpida) */
.jp-vimeo-mask.fade-out-fast { animation: jpMaskFadeOut 400ms ease-out forwards; }

@media (prefers-reduced-motion: reduce){
  .jp-vimeo-mask.fade-out,
  .jp-vimeo-mask.fade-out-fast { animation-duration: 1ms; }
}

/* Fade-IN a negre (només camí manual) */
.jp-vimeo-mask::after {
  content:""; position:absolute; inset:0;
  background:#000; opacity:0; transition: opacity 1400ms ease-in; /* IN = 1400ms */
}
.jp-vimeo-mask.to-black::after { opacity:1; }

/* Estat final */
.jp-vimeo-mask.off { opacity:0; }

/* Admin */
.jp-vimeo-admin-preview { overflow:hidden; }