/**
 * @file
 * Recorte de las fotografias en el listado de investigadores.
 *
 * El tema ya trae "#profile .single-team img { width: 100% }", que deja la
 * altura libre: mientras el original sea cuadrado la tarjeta sale cuadrada,
 * pero cualquier foto con otra proporcion descuadra la rejilla. Fijar la
 * proporcion con aspect-ratio y recortar con object-fit hace que todas las
 * tarjetas midan igual venga como venga el original.
 *
 * La especificidad es mayor que la del tema (se anade .team-thumb), asi que
 * esta regla gana sin necesidad de !important.
 */

/**
 * Cabecera.
 *
 * El tema define ".section { padding: 130px 0 }", pensado para las secciones de
 * una landing. En un listado con filtros eso deja el titulo flotando muy lejos
 * del contenido, con un hueco enorme antes de las tarjetas.
 *
 * Y ".section-header" trae "color: #fff" porque en la landing va sobre fondo
 * oscuro. Aqui el fondo es blanco, asi que hay que devolverle el color o el
 * titulo se vuelve invisible.
 */

#profile.section {
  padding: 40px 0 60px;
}

/* El centrado ya lo pone .section-header del tema; aqui solo se recupera el
   color, que viene forzado a #fff para fondo oscuro. */
.uazuay-investigadores .section-header {
  color: inherit;
  margin-bottom: 28px;
}

.uazuay-investigadores .section-header .section-title {
  font-size: 35px;
  line-height: 1.2;
  margin-bottom: 0;
}

.uazuay-investigadores .container-search-bars hr {
  margin-bottom: 0;
}

.uazuay-investigadores .container-search-bars br {
  display: none;
}

/**
 * Scroll infinito.
 *
 * El centinela es el elemento que, al entrar en pantalla, dispara la carga de
 * la siguiente pagina. Necesita altura propia: uno de 0px puede no llegar a
 * intersecar nunca en algunos navegadores.
 */

.centinela-scroll {
  width: 100%;
  height: 1px;
}

.estado-scroll {
  min-height: 24px;
  margin: 24px 0 0;
  text-align: center;
  color: #6c757d;
  font-size: 15px;
}

#profile .single-team .team-thumb img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center;
}
