/* ====== Estilos del contenedor de encabezados ====== */
.team-header {
  text-align: center;
  margin-bottom: 30px;
  padding: 10px 20px;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* Encabezado principal (azul) */
.team-title {
  color: #055ba5; /* Azul oscuro elegante */
  font-size: 2.2rem;
  font-weight: 800;
  margin-bottom: 8px;
  line-height: 1.2;
}

/* Subencabezado (rojo) */
.team-subtitle {
  color: #c84b4b; /* Rojo profesional */
  font-size: 1.3rem;
  font-weight: 600;
  line-height: 1.4;
}

/* ====== Adaptación responsiva ====== */
@media (max-width: 768px) {
  .team-title {
    font-size: 1.8rem;
  }
  .team-subtitle {
    font-size: 1.1rem;
  }
}

@media (max-width: 480px) {
  .team-title {
    font-size: 1.5rem;
  }
  .team-subtitle {
    font-size: 1rem;
  }
}


/* ====== Estilos del contenedor de los card de presentación ====== */

.team-slider {
  --gap: 22px;
  --autoplay-interval: 9000; /* ms */
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  user-select: none;
}

/* botones */
.team-slider .ts-btn {
  background: white;
  border: 1px solid rgba(0,0,0,0.08);
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(2,6,23,0.06);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex: 0 0 auto;
}
.team-slider .ts-btn:active { transform: translateY(1px); }
.team-slider .ts-btn[disabled] { opacity: 0.45; cursor: default; }

/* Wrapper para el track con overflow escondido */
.team-slider .ts-track-wrapper{
  overflow: hidden;
  flex: 1 1 auto;
}

/* Track: fila horizontal con scroll snap para mejor experiencia */
.team-slider .ts-track {
  display: flex;
  gap: var(--gap);
  padding: 8px;
  scroll-behavior: smooth;
  align-items: center;
  scroll-snap-type: x mandatory;
}

/* Card: responsive: 3 visibles en escritorio, 1 en móvil */
.team-slider .ts-card{
  height: 360px;
  perspective: 1100px;
  flex: 0 0 calc((100% - (var(--gap) * 2)) / 3);
  outline: none;
  scroll-snap-align: center;
  border-radius: 12px;
}

/* Ajustes front/back idénticos a la versión anterior */
.team-slider .ts-card-inner{
  width:100%;
  height:100%;
  position: relative;
  transform-style: preserve-3d;
  transition: transform 0.7s cubic-bezier(.2,.8,.2,1);
  border-radius: 12px;
  box-shadow: 0 8px 18px rgba(2,6,23,0.08);
}
.team-slider .ts-card:hover .ts-card-inner,
.team-slider .ts-card:focus .ts-card-inner,
.team-slider .ts-card.is-flipped .ts-card-inner {
  transform: rotateY(180deg);
}
.team-slider .ts-front,
.team-slider .ts-back {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.team-slider .ts-front {
  background: linear-gradient(180deg, #ffffff 0%, #f7f9fc 100%);
  justify-content: flex-start;
}
.team-slider .ts-photo{
  height: 68%;
  background-size: cover;
  background-position: center;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  display:block;
}
.team-slider .ts-meta{
  padding: 12px;
  text-align:center;
  background: white;
  height: 32%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:6px;
}
.team-slider .ts-name{
  margin:0;
  font-size:1.05rem;
  font-weight:700;
  color:#10304a;
}
.team-slider .ts-role{
  margin:0;
  font-size:.84rem;
  color:#c84b4b;
  font-weight:600;
}
.team-slider .ts-back{
  transform: rotateY(180deg);
  background: linear-gradient(180deg, #0b2b47 0%, #c42b2b 100%);
  color: white;
  align-items: center;
  justify-content: center;
  padding: 18px;
}
.team-slider .ts-back-content{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:12px;
  width:100%;
}
.team-slider .ts-back .ts-name{
  color: #fff;
  font-size:1.05rem;
}
.team-slider .ts-desc{
  font-size:.70rem;
  line-height:1.35;
  margin:0;
  max-height: 15em;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: -5px;
}
.team-slider .ts-info{
  margin-top:6px;
  display:flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:50%;
  background: rgba(255,255,255,0.08);
  color: white;
  box-shadow: inset 0 -6px 12px rgba(0,0,0,0.08);
}

/* Responsive: en pantallas pequeñas muestra 1 card que ocupe todo el ancho disponible */
@media (max-width: 900px){
  .team-slider .ts-card { flex: 0 0 calc((100% - (var(--gap) * 0)) / 1); height: 320px; }
  .team-slider { gap: 8px; }
}
@media (max-width: 520px){
  .team-slider .ts-card { flex: 0 0 100%; height: 260px; }
  .team-slider .ts-btn { width:34px; height:34px; font-size:18px; }
}

/* Toques estéticos: que los botones no tapen cards en pantallas pequeñas */
@media (max-width: 700px){
  .team-slider .ts-btn { flex: 0 0 auto; }
}