/* --------------------------------------------------------------------------
   Páginas Dimensión Creativa / Teatro (banner, plataformas, temporadas, equipo)
   -------------------------------------------------------------------------- */
.banner-page {
  position: relative;
  background: var(--ink-900);
  color: var(--ink-000);
}

/* width explícito: sin él, aspect-ratio + min-height inflan el ancho y
   provocan scroll horizontal en tablet */
.banner-media { position: relative; width: 100%; aspect-ratio: 16 / 6; min-height: 340px; overflow: hidden; }

@media (max-width: 767.98px) { .banner-media { aspect-ratio: 4 / 5; } }

.banner-media img, .banner-media video, .banner-media iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border: 0;
}

/* Botones de plataformas de audio */
.platform-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.6rem 1.2rem;
  border: 1px solid var(--ink-000);
  color: var(--ink-000);
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.platform-btn:hover, .platform-btn:focus-visible {
  background: var(--ink-000);
  color: var(--ink-900);
}

.platform-btn svg { width: 20px; height: 20px; }

/* Pestañas de temporadas */
.season-tabs .nav-link {
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--color-text-muted);
  border: 1px solid var(--color-border);
  border-radius: 0;
  padding: 0.5rem 1.3rem;
  margin-right: 0.5rem;
  margin-bottom: 0.5rem;
}

.season-tabs .nav-link:hover { color: var(--color-text); border-color: var(--ink-900); }

.season-tabs .nav-link.active {
  background: var(--ink-900);
  color: var(--ink-000);
  border-color: var(--ink-900);
}

/* Miembros del equipo (Quiénes somos): misma ficha de foto que los docentes
   en #profesores (carrera.css): marco .prof-card-aut + caja 97px con
   aspect-ratio 0.85 y cover. El .wrapper-photo se centra en la columna con
   el margin: auto de contactus.css. */
#quienes-somos .prof-card-aut { background: #f3f4f4; }

#quienes-somos .team-thumb {
  width: 97px;
  aspect-ratio: 0.85 / 1;
  overflow: hidden;
  background: var(--ink-100);
}

#quienes-somos .team-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: grayscale(85%);
  transition: var(--transition);
}