/* ==============================
   FQC - Eventos (solo esta vista)
   ============================== */

/* ===== HERO EVENTOS ===== */
body .page-title.hero-eventos{
  --hero-h: clamp(360px, 45vh, 520px);
  min-height: var(--hero-h);
  display:flex;
  align-items:center;
  width:100%;
  overflow:hidden;

  background-image:none !important;
  background-color:#f5f9fc !important;

  background: url("../imagenes/Eventos_2.png?v=1") right center / auto 100% no-repeat,
              #f5f9fc !important;
}

body .page-title.hero-eventos::before,
body .page-title.hero-eventos::after{
  content:none !important;
  display:none !important;
}

body .page-title.hero-eventos > .container{
  position:relative;
  z-index:1;
}

body .page-title.hero-eventos .white-bg{
  background:transparent !important;
  box-shadow:none !important;
  border:0 !important;
}
body .page-title.hero-eventos .page-breadcrumb{ border-top:0 !important; }

/* Banner real móvil/tablet */
body .page-title.hero-eventos .hero-bg-mobile{ display:none; }

@media (max-width: 991.98px){
  body .page-title.hero-eventos{
    background:#f5f9fc !important;
    min-height:auto !important;
    height:auto !important;
    overflow:hidden !important;
    position:relative;
    padding:0 !important;
  }

  body .page-title.hero-eventos .hero-bg-mobile{
    display:block;
    width:100%;
    height:auto;
    max-width:100%;
    object-fit:contain;
  }

  body .page-title.hero-eventos > .container{
    position:absolute !important;
    left:0; right:0;
    top:0;
    z-index:2;
  }

  body .page-title.hero-eventos .white-bg{ margin-top:.75rem; }
}

/* Breadcrumb responsive: último item baja */
@media (max-width: 991.98px){
  body .page-title .page-breadcrumb .breadcrumb{
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
  }

  body .page-title .page-breadcrumb .breadcrumb .breadcrumb-item.active{
    flex:0 0 100% !important;
    width:100% !important;
    display:inline-flex !important;
    align-items:center !important;
    margin-top:.25rem !important;
    padding-left: inherit !important;
    white-space: normal !important;
  }

  body .page-title .page-breadcrumb .breadcrumb .breadcrumb-item.active::before,
  body .page-title .page-breadcrumb .breadcrumb .breadcrumb-item + .breadcrumb-item::before{
    display:inline-block !important;
    float:none !important;
  }
}

/* ==============================
   Cards de Eventos (no cambian estructura, solo orden visual)
   ============================== */
.eventos-listado .evento-img{
  height:150px;
  width:250px;
  margin:auto;
}
.eventos-listado .evento-img img{
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:cover;
  display:block;
}

.eventos-listado .evento-titulo{
  margin:0 0 6px;
}
.eventos-listado .evento-subtitulo{
  margin:0 0 6px;
}
.eventos-listado .evento-fecha{
  font-size:.9rem;
  margin-top:2px;
}
.eventos-listado .evento-detalle{
  margin-top:10px;
}

/* ==============================
   Galería: miniaturas sin deformar
   ============================== */
.eventos-galeria .cases-item{
  height: 220px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#f5f8fd;
}
.eventos-galeria .cases-item img{
  max-width:100%;
  max-height:100%;
  width:auto;
  height:auto;
  object-fit:contain; /* NO recorta */
  display:block;
}