/* docentes — sección dividida: texto (izquierda) + foto del docente (derecha) */

/* Fondo negro (diseño Figma): textura desaturada (blend "color") + scrim suave
   —docentes-bg ya es oscuro— para neutralizar su tinte frío sin aplanarla. */
.docentes {
  background:
    linear-gradient(rgba(5, 8, 14, 0.55), rgba(5, 8, 14, 0.55)),
    linear-gradient(#000, #000),
    url("../../assets/img/docentes-bg.webp") center / cover no-repeat,
    #05080e;
  background-blend-mode: normal, color, normal, normal;
  padding: var(--sp) 0;
}
.docentes__title { font-weight: 800; font-size: 40px; text-align: center; line-height: 1.15; margin-bottom: 48px; }
.docentes__title .text-gold { font-weight: 700; }

.docentes__split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }

.docentes__info { max-width: 520px; }
.docentes__flag { display: inline-block; font-family: var(--font-mont); font-weight: 700; font-size: 13px; color: var(--gold); letter-spacing: 1.5px; }
.docentes__name { font-family: var(--font-sora); font-weight: 700; font-size: 30px; color: #fff; margin-top: 12px; line-height: 1.2; }
.docentes__role { font-family: var(--font-mont); font-weight: 600; font-size: 15px; color: rgba(255, 255, 255, 0.78); margin-top: 10px; }
.docentes__bio { font-family: var(--font-mont); font-size: 15px; line-height: 1.7; color: rgba(255, 255, 255, 0.82); margin-top: 22px; }

.docentes__media { display: flex; justify-content: center; }
.docentes__stage { position: relative; width: 100%; max-width: 460px; aspect-ratio: 1218 / 1292; }
.docentes__bg,
.docentes__figure { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; display: block; }
.docentes__bg { z-index: 1; }
/* Recorta solo la base de la figura en la línea del marco: su saco se apoya sobre el borde dorado y no lo tapa ni se sale. */
.docentes__clip { position: absolute; inset: 0; z-index: 2; clip-path: inset(-50% -50% 1.5% -50%); }
/* Aura dorada estática que sigue la silueta (drop-shadow usa el canal alpha). Sin cambio en hover. */
.docentes__figure {
  z-index: 2;
  object-position: bottom center;
  filter: drop-shadow(0 0 4px rgba(255, 200, 0, 0.22)) drop-shadow(0 0 10px rgba(255, 200, 0, 0.1));
}

@media (max-width: 900px) {
  .docentes__split { grid-template-columns: 1fr; gap: 32px; }
  .docentes__media { order: -1; }
  .docentes__info { max-width: none; }
  .docentes__title { font-size: 30px; }
  .docentes__name { font-size: 26px; }
}