/* ===== Eventos de Turismo (fallback sin TEC) — card + modal ===== */

/* Card: hereda .tc-evento-card / .tc-evento-body / .tc-evento-title / .tc-evento-meta
   de main.css, pero es un <button>, no un <a>, así que resetea estilos nativos. */
.tc-evento-card-btn{
  display:block;
  width:100%;
  text-align:left;
  font:inherit;
  color:inherit;
  cursor:pointer;
  background:#fff;
  border:1px solid #e4eaf4;
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 6px 18px rgba(13,43,94,.05);
  transition:transform .2s,box-shadow .2s;
}
.tc-evento-card-btn:hover,.tc-evento-card-btn:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 12px 28px rgba(13,43,94,.1);
}
.tc-evento-card-btn:focus-visible{ outline:3px solid var(--gold); outline-offset:2px; }

/* Imagen tipo afiche: se muestra completa, sin recortar (contain), con fondo
   navy detrás para que no quede blanco alrededor del póster. */
.tc-evento-img.is-poster{
  height:auto;
  aspect-ratio:1052/1492;
  background:linear-gradient(135deg,var(--navy3),var(--navy2));
}
.tc-evento-img.is-poster img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:contain;
}

/* ===== Modal ===== */
.evt-modal{
  position:fixed; inset:0; z-index:9999;
  display:flex; align-items:center; justify-content:center;
  padding:20px;
}
.evt-modal[hidden]{ display:none; }
.evt-modal-overlay{
  position:absolute; inset:0;
  background:rgba(7,24,48,.78);
  backdrop-filter:blur(6px);
}
.evt-modal-panel{
  position:relative;
  background:#fff;
  border-radius:18px;
  width:100%; max-width:560px;
  max-height:92vh; overflow-y:auto;
  box-shadow:0 30px 80px rgba(0,0,0,.35);
  animation:evt-modal-in .28s cubic-bezier(.34,1.4,.64,1);
}
@keyframes evt-modal-in{
  from{ opacity:0; transform:scale(.94) translateY(10px); }
  to{ opacity:1; transform:none; }
}
.evt-modal-close{
  position:absolute; top:14px; right:14px; z-index:2;
  width:34px; height:34px; border-radius:50%;
  background:rgba(7,24,48,.55); color:#fff; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition:background .2s ease;
}
.evt-modal-close:hover{ background:var(--red); }

.evt-modal-media{
  position:relative; width:100%;
  aspect-ratio:1052/1492;
  background:linear-gradient(135deg,var(--navy3),var(--navy2));
  border-radius:18px 18px 0 0; overflow:hidden;
}
.evt-modal-media img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:contain;
}

.evt-modal-info{ padding:22px 26px 26px; }
.evt-modal-info h3{ font-family:Montserrat,sans-serif; font-weight:800; color:var(--navy); font-size:19px; margin:0 0 8px; }
.evt-modal-info p.evt-modal-desc{ font-size:13.5px; line-height:1.6; color:#5a6472; margin:0 0 16px; }

.evt-modal-facts{
  display:flex; flex-direction:column; gap:10px;
  margin:0 0 20px;
  padding:14px 16px;
  background:#f7f8fb;
  border-radius:12px;
}
.evt-fact{ display:flex; align-items:flex-start; gap:10px; font-size:13px; color:var(--navy); line-height:1.5; }
.evt-fact strong{ font-weight:700; }
.evt-fact a{ color:var(--navy); text-decoration:underline; }

.evt-modal-actions{ display:flex; flex-wrap:wrap; gap:10px; }
.evt-modal-actions .mdbtn{ text-decoration:none; }

@media (prefers-reduced-motion:reduce){
  .tc-evento-card-btn{ transition:none; }
  .evt-modal-panel{ animation:none !important; }
}