/* popup.css */
.popup-backdrop{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.65);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  padding: 1.25rem;
}

.popup-backdrop.show{ display:flex; }

.popup-modal{
  width: min(920px, 100%);
  background: #0b0f19;
  border-radius: 1.25rem;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.45);
  position: relative;
}

.popup-close{
  position:absolute;
  top:.75rem;
  right:.75rem;
  width:40px;
  height:40px;
  border:none;
  border-radius: 999px;
  cursor:pointer;
  background: rgba(0,0,0,.55);
  color:#fff;
  font-size: 1.1rem;
  z-index: 10000;      /* súper arriba */
  pointer-events: auto; /* garantiza click */
}


.popup-media img,
.popup-media video{
  width: 100%;
  height: auto;
  display:block;
    position: relative;
  z-index: 1;
}

.popup-embed{
  position: relative;
  padding-top: 56.25%;
  background:#000;
}
.popup-embed iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}

.popup-actions{
  padding: 1rem 1.25rem;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap: 1rem;
}

.popup-title{
  color:#fff;
  font-weight:600;
}

.popup-btn{
  background: var(--color-primary, #e6232a);
  color:#fff;
  text-decoration:none;
  padding:.6rem 1rem;
  border-radius: 999px;
  font-weight:600;
  text-transform: uppercase;
  letter-spacing:.08em;
  font-size: .85rem;
}

.popup-btn:hover{
  background: var(--color-accent, #ffcc00);
  color:#000;
}

/* Limitar el tamaño del modal en pantallas grandes */
.popup-modal{
  width: min(920px, 92vw);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
}

/* El contenedor de media no debe crecer infinito */
.popup-media{
  max-height: 70vh;
  overflow: hidden;
}

/* Video: que nunca se desborde */
.popup-media video{
  width: 100%;
  max-height: 70vh;
  height: auto;
  object-fit: contain;
  background: #000;
}

/* Imagen: igual */
.popup-media img{
  width: 100%;
  max-height: 70vh;
  height: auto;
  object-fit: contain;
  background: #000;
}

