/* ================================================================
   TEEM 2025 — Layout de páginas internas
   Se carga DESPUÉS de teem-2025.css en todas las páginas internas.
================================================================ */

/* ================================================================
   HERO INTERNO
================================================================ */
.teem-page-hero {
  background: var(--ink);
  position: relative; overflow: hidden;
  padding: 4.5rem 0 3.5rem;
}
.teem-page-hero::before {
  content: ''; position: absolute; inset: 0;
  background-image: var(--flor-bg);
  background-size: var(--flor-size);
  background-repeat: repeat;
  background-position: top left;
  opacity: .35;
  pointer-events: none;
}
.teem-page-hero::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, transparent 30%, rgba(26,26,30,.6) 100%);
  pointer-events: none;
}
.teem-page-hero > * { position: relative; z-index: 1; }

/* Breadcrumbs */
.teem-breadcrumb {
  display: flex; align-items: center; gap: .375rem;
  list-style: none; margin: 0 0 1.25rem; padding: 0;
  font-size: var(--tx-xs); font-weight: 500;
}
.teem-breadcrumb li { display: flex; align-items: center; gap: .375rem; }
.teem-breadcrumb a {
  color: rgba(255,255,255,.5); text-decoration: none;
  transition: color var(--tf);
}
.teem-breadcrumb a:hover { color: rgba(255,255,255,.85); }
.teem-breadcrumb__sep {
  color: rgba(255,255,255,.25); font-size: 10px;
}
.teem-breadcrumb__current {
  color: var(--morado-soft); font-weight: 600;
}

/* Título de página */
.teem-page-hero__eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: var(--tx-xs); font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--morado-light);
  margin-bottom: .75rem;
}
.teem-page-hero__title {
  font-size: clamp(2rem, 3.5vw, 3rem); font-weight: 800;
  color: var(--white); line-height: 1.1; letter-spacing: -.02em;
}
.teem-page-hero__sub {
  font-size: var(--tx-lg); font-weight: 300; line-height: 1.65;
  color: rgba(255,255,255,.55); max-width: 600px; margin-top: .75rem;
}

/* ================================================================
   CONTENIDO DE PÁGINA
================================================================ */
.teem-page-body {
  padding: 3.5rem 0 5rem;
  background: var(--white);
}
.teem-page-content {
  max-width: 780px;
}
.teem-page-content h2 {
  font-size: var(--tx-2xl); font-weight: 800; color: var(--ink);
  margin: 2.5rem 0 1rem; letter-spacing: -.01em;
}
.teem-page-content h3 {
  font-size: var(--tx-xl); font-weight: 700; color: var(--ink);
  margin: 2rem 0 .75rem;
}
.teem-page-content p {
  font-size: var(--tx-base); color: var(--gris1);
  line-height: 1.8; margin-bottom: 1.25rem;
}
.teem-page-content p:last-child { margin-bottom: 0; }

.teem-page-content blockquote {
  margin: 2rem 0; padding: 1.5rem 2rem;
  background: var(--morado-ghost); border-left: 4px solid var(--morado);
  border-radius: 0 var(--r-lg) var(--r-lg) 0;
}
.teem-page-content blockquote p {
  font-style: italic; color: var(--gris1); margin-bottom: 0;
}

/* Highlight box */
.teem-highlight {
  display: flex; gap: 1.25rem; padding: 1.75rem;
  background: var(--morado-pale); border-radius: var(--r-xl);
  border: 1px solid rgba(114,34,130,.15); margin: 2rem 0;
}
.teem-highlight__icon {
  width: 48px; height: 48px; border-radius: var(--r-md);
  background: var(--morado); display: flex; align-items: center;
  justify-content: center; flex-shrink: 0;
}
.teem-highlight__icon svg {
  width: 22px; height: 22px; stroke: var(--white); fill: none;
  stroke-width: 1.5;
}
.teem-highlight__title {
  font-size: var(--tx-base); font-weight: 700; color: var(--ink);
  margin-bottom: .25rem;
}
.teem-highlight__text {
  font-size: var(--tx-sm); color: var(--gris1); line-height: 1.65;
}

/* Sidebar nav (para secciones con varias sub-páginas) */
.teem-page-layout {
  display: grid; grid-template-columns: 240px 1fr; gap: 4rem;
  align-items: start;
}
.teem-sidenav {
  position: sticky; top: calc(var(--hh) + 1.5rem);
  display: flex; flex-direction: column; gap: 2px;
}
.teem-sidenav__title {
  font-size: 10px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; color: var(--morado);
  margin-bottom: .75rem;
}
.teem-sidenav__link {
  display: block; padding: .625rem 1rem; font-size: var(--tx-sm);
  font-weight: 500; color: var(--gris1); border-radius: var(--r-md);
  text-decoration: none; transition: all var(--tf);
  border-left: 3px solid transparent;
}
.teem-sidenav__link:hover {
  background: var(--morado-ghost); color: var(--morado);
}
.teem-sidenav__link--active {
  background: var(--morado-pale); color: var(--morado);
  font-weight: 700; border-left-color: var(--morado);
}

/* ================================================================
   LISTAS DE CONTENIDO
================================================================ */
.teem-page-content ul,
.teem-page-content ol {
  font-size: var(--tx-base); color: var(--gris1);
  line-height: 1.8; margin: 0 0 1.25rem; padding-left: 1.5rem;
}
.teem-page-content li { margin-bottom: .5rem; }
.teem-page-content li:last-child { margin-bottom: 0; }

/* ================================================================
   TARJETAS DE VIDEO
================================================================ */
.teem-video-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 1.25rem; margin: 1.5rem 0 2.5rem;
}
.teem-video-card {
  background: var(--white); border: 1.5px solid var(--gris4);
  border-radius: var(--r-xl); overflow: hidden;
  transition: all var(--tb) var(--ease);
}
.teem-video-card:hover {
  border-color: var(--morado-light); box-shadow: var(--sh-md);
  transform: translateY(-2px);
}
.teem-video-card__player { background: #000; }
.teem-video-card__info { padding: 1.25rem; }
.teem-video-card__title {
  font-size: var(--tx-base); font-weight: 700; color: var(--ink);
  margin: 0 0 .375rem;
}
.teem-video-card__desc {
  font-size: var(--tx-sm); color: var(--gris2); line-height: 1.55; margin: 0;
}

/* ================================================================
   FORMULARIOS INSTITUCIONALES
================================================================ */
.teem-form { margin-top: 1.5rem; }
.teem-form__group { margin-bottom: 1.25rem; }
.teem-form__row {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
.teem-form__label {
  display: flex; align-items: center; gap: .375rem;
  font-size: var(--tx-sm); font-weight: 600; color: var(--ink);
  margin-bottom: .375rem;
}
.teem-form__req { color: #dc2626; }
.teem-form__input {
  display: block; width: 100%; padding: .75rem 1rem;
  font-size: var(--tx-base); font-family: var(--font); color: var(--ink);
  border: 1.5px solid var(--gris4); border-radius: var(--r-lg);
  background: var(--white); transition: border-color var(--tf);
}
.teem-form__input:focus {
  outline: none; border-color: var(--morado);
  box-shadow: 0 0 0 3px rgba(114,34,130,.12);
}
.teem-form__input::placeholder { color: var(--gris3); }
.teem-form__textarea { resize: vertical; min-height: 120px; }
select.teem-form__input { cursor: pointer; }
input[type="file"].teem-form__input {
  padding: .5rem; font-size: var(--tx-sm);
}
.teem-form__actions {
  display: flex; gap: .75rem; align-items: center;
  margin-top: 1.5rem; padding-top: 1.5rem;
  border-top: 1px solid var(--gris4);
}

/* Fila de 3 columnas */
.teem-form__row--3 {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
}
/* Leyenda de fieldset */
.teem-form__legend {
  font-size: var(--tx-base); font-weight: 700; color: var(--ink);
  margin-bottom: 1.25rem; line-height: 1.5;
}
/* Checkboxes custom */
.teem-form__checks {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem;
}
.teem-form__check {
  display: flex; align-items: flex-start; gap: .5rem;
  font-size: var(--tx-sm); color: var(--gris1); cursor: pointer;
  padding: .75rem; border: 1.5px solid var(--gris4);
  border-radius: var(--r-md); transition: all var(--tf);
}
.teem-form__check:hover { border-color: var(--morado-light); background: var(--morado-ghost); }
.teem-form__check:has(:checked) { border-color: var(--morado); background: var(--morado-ghost); }
.teem-form__checkbox {
  width: 18px; height: 18px; flex-shrink: 0; margin-top: 2px;
  accent-color: var(--morado); cursor: pointer;
}
/* Radios */
.teem-form__radios { display: flex; gap: 1.5rem; margin-top: .375rem; }
.teem-form__radio {
  display: flex; align-items: center; gap: .375rem;
  font-size: var(--tx-sm); color: var(--gris1); cursor: pointer;
}
.teem-form__radio input { accent-color: var(--morado); cursor: pointer; }
/* Errores */
.teem-form__errors {
  background: rgba(239,68,68,.06); border: 1.5px solid rgba(239,68,68,.2);
  border-radius: var(--r-lg); padding: 1rem 1.25rem;
  font-size: var(--tx-sm); color: #b91c1c; margin-bottom: 1rem;
}
.teem-form__errors ul { margin: .5rem 0 0; padding-left: 1.25rem; }
.teem-form__errors li { margin-bottom: .25rem; }
/* Indicador de pasos */
.teem-steps {
  display: flex; align-items: center; gap: .75rem;
  margin-bottom: 2rem; padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--gris4);
}
.teem-steps__item {
  display: flex; align-items: center; gap: .5rem;
}
.teem-steps__num {
  width: 32px; height: 32px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: var(--tx-sm); font-weight: 700;
  border: 2px solid var(--gris4); color: var(--gris3);
  transition: all var(--tf);
}
.teem-steps__label { font-size: var(--tx-sm); color: var(--gris3); font-weight: 600; }
.teem-steps__bar { flex: 1; height: 2px; background: var(--gris4); }
.teem-steps__item--active .teem-steps__num {
  background: var(--morado); border-color: var(--morado); color: var(--white);
}
.teem-steps__item--active .teem-steps__label { color: var(--ink); }
.teem-steps__item--done .teem-steps__num {
  background: var(--morado-light); border-color: var(--morado); color: var(--morado);
}
.teem-steps__item--done .teem-steps__label { color: var(--morado); }
/* Modal */
.teem-modal-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.5); backdrop-filter: blur(4px);
  display: flex; align-items: center; justify-content: center;
  padding: 1rem;
}
.teem-modal {
  background: var(--white); border-radius: var(--r-xl);
  max-width: 520px; width: 100%; box-shadow: 0 20px 60px rgba(0,0,0,.2);
}
.teem-modal__header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 1.25rem 1.5rem; border-bottom: 1px solid var(--gris4);
}
.teem-modal__title { font-size: var(--tx-base); font-weight: 700; color: var(--ink); margin: 0; }
.teem-modal__close {
  background: none; border: none; font-size: 1.5rem; color: var(--gris2);
  cursor: pointer; line-height: 1; padding: 0;
}
.teem-modal__close:hover { color: var(--ink); }
.teem-modal__body { padding: 1.5rem; font-size: var(--tx-sm); color: var(--gris1); line-height: 1.7; }
.teem-modal__body p { margin: 0 0 .75rem; }
.teem-modal__footer {
  display: flex; gap: .75rem; justify-content: flex-end;
  padding: 1rem 1.5rem; border-top: 1px solid var(--gris4);
}

@media (max-width: 768px) {
  .teem-form__row { grid-template-columns: 1fr; }
  .teem-form__row--3 { grid-template-columns: 1fr; }
  .teem-form__checks { grid-template-columns: 1fr 1fr; }
  .teem-form__actions { flex-direction: column; }
  .teem-form__actions .teem-btn { width: 100%; justify-content: center; }
  .teem-steps__label { display: none; }
}
@media (max-width: 480px) {
  .teem-form__checks { grid-template-columns: 1fr; }
}

/* ================================================================
   SELECTOR DE AÑO (archivo histórico)
================================================================ */
.teem-year-selector {
  display: flex; flex-wrap: wrap; align-items: center; gap: .375rem;
  margin-bottom: 2rem; padding: 1rem;
  background: var(--gris5); border-radius: var(--r-xl);
  border: 1px solid var(--gris4);
}
.teem-year-selector__btn {
  padding: .375rem .75rem; font-size: var(--tx-xs); font-weight: 600;
  color: var(--gris1); background: var(--white);
  border: 1.5px solid var(--gris4); border-radius: var(--r-pill);
  text-decoration: none; transition: all var(--tf);
  font-variant-numeric: tabular-nums;
}
.teem-year-selector__btn:hover {
  border-color: var(--morado); color: var(--morado);
  background: var(--morado-ghost);
}
.teem-year-selector__btn--active {
  background: var(--morado); color: var(--white);
  border-color: var(--morado);
}
.teem-year-selector__btn--active:hover {
  background: var(--morado-dark); border-color: var(--morado-dark);
  color: var(--white);
}

/* ================================================================
   FORMULARIO DE BÚSQUEDA
================================================================ */
.teem-search-form { margin-bottom: 2.5rem; }
.teem-search-form__label {
  display: block; font-size: var(--tx-sm); font-weight: 700;
  color: var(--ink); margin-bottom: .5rem;
}
.teem-search-form__row {
  display: flex; gap: .5rem;
}
.teem-search-form__input {
  flex: 1; padding: .75rem 1rem; font-size: var(--tx-base);
  font-family: var(--font); color: var(--ink);
  border: 1.5px solid var(--gris4); border-radius: var(--r-lg);
  background: var(--white); transition: border-color var(--tf);
}
.teem-search-form__input:focus {
  outline: none; border-color: var(--morado);
  box-shadow: 0 0 0 3px rgba(114,34,130,.12);
}
.teem-search-form__input::placeholder { color: var(--gris3); }

/* ================================================================
   LISTA DE BOLETINES / AVISOS
================================================================ */
.teem-bulletin-list {
  list-style: none; margin: 1rem 0 0; padding: 0;
}
.teem-bulletin {
  display: flex; gap: 1.25rem; padding: 1rem 0;
  border-bottom: 1px solid var(--gris4);
  align-items: flex-start;
}
.teem-bulletin:last-child { border-bottom: none; }
.teem-bulletin__date {
  flex-shrink: 0; width: 90px;
  font-size: var(--tx-xs); font-weight: 600; color: var(--gris2);
  font-variant-numeric: tabular-nums; padding-top: 2px;
}
.teem-bulletin__ref {
  font-size: 10px; font-weight: 700; letter-spacing: .08em;
  color: var(--gris3); text-transform: uppercase; margin-bottom: 2px;
}
.teem-bulletin__title {
  font-size: var(--tx-sm); font-weight: 600; color: var(--ink);
  text-decoration: none; line-height: 1.45;
  transition: color var(--tf);
}
.teem-bulletin__title:hover { color: var(--morado); }

/* ================================================================
   TARJETAS DE LENGUAS INDÍGENAS
================================================================ */
.teem-lang-grid {
  list-style: none; margin: 1.5rem 0 2rem; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: .875rem;
}
.teem-lang-card {
  padding: 1.375rem; background: var(--white);
  border: 1.5px solid var(--gris4); border-radius: var(--r-xl);
  transition: all var(--tb) var(--ease);
}
.teem-lang-card:hover {
  border-color: var(--morado-light); transform: translateY(-2px);
  box-shadow: var(--sh-sm);
}
.teem-lang-card__badge {
  display: inline-block; font-size: var(--tx-xs); font-weight: 700;
  color: var(--morado); background: var(--morado-pale);
  padding: 2px .75rem; border-radius: var(--r-pill);
  letter-spacing: .05em;
}
.teem-lang-card__native {
  font-size: var(--tx-xl); font-weight: 800; color: var(--ink);
  margin: .5rem 0 .375rem; letter-spacing: -.01em;
}
.teem-lang-card__desc {
  font-size: var(--tx-sm); color: var(--gris1); line-height: 1.65;
}

/* ================================================================
   LISTA DE SERVICIOS (Defensoría)
================================================================ */
.teem-def-services {
  list-style: none; margin: 1.5rem 0 2rem; padding: 0;
  display: flex; flex-direction: column; gap: .75rem;
}
.teem-def-svc {
  display: flex; gap: 1.25rem; padding: 1.5rem;
  background: var(--white); border: 1.5px solid var(--gris4);
  border-radius: var(--r-xl); transition: all var(--tb) var(--ease);
}
.teem-def-svc:hover {
  border-color: var(--morado-light); box-shadow: var(--sh-sm);
  transform: translateY(-2px);
}
.teem-def-svc__icon {
  width: 48px; height: 48px; border-radius: var(--r-md);
  background: var(--morado-pale); display: flex; align-items: center;
  justify-content: center; flex-shrink: 0; transition: background var(--tb);
}
.teem-def-svc__icon svg {
  width: 22px; height: 22px; stroke: var(--morado); fill: none;
  stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.teem-def-svc:hover .teem-def-svc__icon { background: var(--morado); }
.teem-def-svc:hover .teem-def-svc__icon svg { stroke: var(--white); }
.teem-def-svc__title {
  font-size: var(--tx-base); font-weight: 700; color: var(--ink);
  margin: 0 0 .25rem;
}
.teem-def-svc__desc {
  font-size: var(--tx-sm); color: var(--gris1); line-height: 1.65; margin: 0;
}

/* ================================================================
   TABLAS INSTITUCIONALES
================================================================ */
.teem-table-wrap {
  overflow-x: auto; margin: 1rem 0 1.75rem;
  border: 1.5px solid var(--gris4); border-radius: var(--r-xl);
}
.teem-table {
  width: 100%; border-collapse: collapse;
  font-size: var(--tx-sm); font-family: var(--font);
}
.teem-table th {
  background: var(--morado); color: var(--white);
  font-weight: 600; text-align: left;
  padding: .75rem 1rem; font-size: var(--tx-xs);
  letter-spacing: .03em; text-transform: uppercase;
  white-space: nowrap;
}
.teem-table td {
  padding: .625rem 1rem; color: var(--gris1);
  border-top: 1px solid var(--gris4);
  font-variant-numeric: tabular-nums;
}
.teem-table tbody tr:hover { background: var(--morado-ghost); }
.teem-table tfoot td {
  background: var(--gris5); font-weight: 700; color: var(--ink);
  border-top: 2px solid var(--gris4);
}

/* Botones de documentos (ver/descargar) */
.teem-doc-name { font-size: var(--tx-sm); line-height: 1.5; }
.teem-doc-actions {
  white-space: nowrap; text-align: right;
  display: flex; gap: .375rem; justify-content: flex-end;
}
.teem-doc-btn {
  display: inline-flex; align-items: center; gap: .375rem;
  padding: .375rem .875rem; font-size: var(--tx-xs); font-weight: 700;
  border-radius: var(--r-pill); text-decoration: none;
  transition: all var(--tb) var(--ease);
  background: var(--morado); color: var(--white);
  border: 1.5px solid var(--morado);
}
.teem-doc-btn svg { flex-shrink: 0; }
.teem-doc-btn:hover {
  background: var(--morado-dark); border-color: var(--morado-dark);
  transform: translateY(-1px); box-shadow: var(--sh-pur); color: var(--white);
}
.teem-doc-btn--dl {
  background: var(--white); color: var(--morado);
  border-color: var(--morado);
}
.teem-doc-btn--dl:hover {
  background: var(--morado-pale); color: var(--morado);
  border-color: var(--morado); transform: translateY(-1px);
  box-shadow: var(--sh-sm);
}

/* Resumen estadístico (tarjetas numéricas) */
.teem-stat-summary {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 1rem; margin: 1.5rem 0 2.5rem;
}
.teem-stat-summary__card {
  padding: 1.5rem; text-align: center;
  background: var(--white); border: 1.5px solid var(--gris4);
  border-radius: var(--r-xl); transition: all var(--tb);
}
.teem-stat-summary__card:hover {
  border-color: var(--morado-light); transform: translateY(-2px);
}
.teem-stat-summary__card--hl {
  background: var(--morado); border-color: var(--morado);
}
.teem-stat-summary__card--hl:hover {
  border-color: var(--morado-dark); background: var(--morado-dark);
}
.teem-stat-summary__n {
  font-size: clamp(2rem, 3vw, 2.75rem); font-weight: 800;
  color: var(--morado); line-height: 1; letter-spacing: -.02em;
}
.teem-stat-summary__card--hl .teem-stat-summary__n { color: var(--white); }
.teem-stat-summary__l {
  font-size: var(--tx-sm); font-weight: 700; color: var(--ink);
  margin-top: .375rem;
}
.teem-stat-summary__card--hl .teem-stat-summary__l { color: rgba(255,255,255,.9); }
.teem-stat-summary__s {
  font-size: var(--tx-xs); color: var(--gris3); margin-top: .125rem;
}
.teem-stat-summary__card--hl .teem-stat-summary__s { color: rgba(255,255,255,.55); }

/* ================================================================
   TARJETAS LEGALES (marco jurídico)
================================================================ */
.teem-legal-card {
  padding: 1.5rem; margin-bottom: 1rem;
  background: var(--white); border: 1.5px solid var(--gris4);
  border-radius: var(--r-xl); transition: border-color var(--tb);
}
.teem-legal-card:hover { border-color: var(--morado-light); }
.teem-legal-card__rank {
  display: inline-block; font-size: 10px; font-weight: 700;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--morado); background: var(--morado-pale);
  padding: 2px .625rem; border-radius: var(--r-pill);
  margin-bottom: .625rem;
}
.teem-legal-card__title {
  font-size: var(--tx-base); font-weight: 700; color: var(--ink);
  line-height: 1.35; margin: 0 0 .5rem;
}
.teem-legal-card__desc {
  font-size: var(--tx-sm); color: var(--gris1); line-height: 1.7; margin: 0;
}
.teem-legal-card__link {
  display: inline-flex; align-items: center; gap: .375rem;
  font-size: var(--tx-sm); font-weight: 700; color: var(--morado);
  text-decoration: none; margin-top: .75rem; transition: gap var(--tf);
}
.teem-legal-card__link:hover { gap: .625rem; }

/* ================================================================
   TARJETAS DE MAGISTRADOS
================================================================ */
.teem-mag-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 1.25rem; list-style: none; margin: 0; padding: 0;
}
.teem-mag-card {
  background: var(--white); border: 1.5px solid var(--gris4);
  border-radius: var(--r-xl); padding: 1.75rem;
  transition: all var(--tb) var(--ease);
}
.teem-mag-card:hover {
  border-color: var(--morado-light); box-shadow: var(--sh-pur);
  transform: translateY(-2px);
}
.teem-mag-card__header {
  display: flex; align-items: center; gap: 1rem; margin-bottom: 1.25rem;
}
.teem-mag-card__avatar {
  width: 64px; height: 64px; border-radius: 50%; flex-shrink: 0;
  background: linear-gradient(135deg, var(--morado-mid), var(--morado-dark));
  border: 2px solid var(--morado-soft);
  display: flex; align-items: center; justify-content: center;
}
.teem-mag-card__avatar svg {
  width: 28px; height: 28px; stroke: rgba(255,255,255,.6);
  fill: none; stroke-width: 1.5;
}
.teem-mag-card__name {
  font-size: var(--tx-lg); font-weight: 700; color: var(--ink); line-height: 1.25;
}
.teem-mag-card__role {
  font-size: var(--tx-xs); color: var(--morado); font-weight: 600;
  text-transform: uppercase; letter-spacing: .07em; margin-top: 2px;
}
.teem-mag-card__section-title {
  font-size: 10px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; color: var(--gris3);
  margin: 1rem 0 .5rem; padding-top: .75rem;
  border-top: 1px solid var(--gris4);
}
.teem-mag-card__list {
  list-style: none; margin: 0; padding: 0;
}
.teem-mag-card__list li {
  font-size: var(--tx-sm); color: var(--gris1); line-height: 1.55;
  padding: .25rem 0; padding-left: .875rem;
  position: relative;
}
.teem-mag-card__list li::before {
  content: ''; position: absolute; left: 0; top: .625rem;
  width: 4px; height: 4px; border-radius: 50%;
  background: var(--morado-light);
}

/* ================================================================
   TIMELINE (antecedentes)
================================================================ */
.teem-timeline {
  position: relative; padding-left: 2rem;
  border-left: 2px solid var(--gris4);
  margin: 2rem 0;
}
.teem-timeline__item {
  position: relative; margin-bottom: 2rem; padding-bottom: .5rem;
}
.teem-timeline__item:last-child { margin-bottom: 0; }
.teem-timeline__dot {
  position: absolute; left: -2.625rem; top: .25rem;
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--morado); border: 2px solid var(--white);
  box-shadow: 0 0 0 2px var(--morado-light);
}
.teem-timeline__year {
  font-size: var(--tx-sm); font-weight: 700; color: var(--morado);
  letter-spacing: .05em; margin-bottom: .25rem;
}
.teem-timeline__text {
  font-size: var(--tx-sm); color: var(--gris1); line-height: 1.7;
}

/* ================================================================
   DIRECTORIO (tabla de contactos)
================================================================ */
.teem-dir-grid {
  display: grid; grid-template-columns: 1fr; gap: 1.25rem;
  margin: 1.5rem 0;
}
.teem-dir-group {
  display: grid; grid-template-columns: 160px 1fr;
  min-height: 160px;
  background: var(--white); border: 1.5px solid var(--gris4);
  border-radius: var(--r-xl); overflow: hidden;
  transition: all var(--tb) var(--ease);
}
.teem-dir-group:hover {
  border-color: var(--morado-light); box-shadow: var(--sh-pur);
}
/* Foto del titular */
.teem-dir-group__photo {
  background: linear-gradient(135deg, var(--morado-mid), var(--morado-dark));
  overflow: hidden;
}
.teem-dir-group__photo img {
  width: 100%; height: 100%; object-fit: cover; object-position: top center;
  display: block;
}
/* Contenido derecho */
.teem-dir-group__body { display: flex; flex-direction: column; }
.teem-dir-group__title {
  padding: .875rem 1.25rem; font-size: var(--tx-sm); font-weight: 700;
  color: var(--white); background: var(--morado);
}
.teem-dir-group__rows { padding: .375rem 0; }
.teem-dir-row {
  display: grid; grid-template-columns: 1fr auto;
  gap: 1rem; align-items: center;
  padding: .5rem 1.25rem; font-size: var(--tx-sm);
  transition: background var(--tf);
}
.teem-dir-row:hover { background: var(--morado-ghost); }
.teem-dir-row__label { color: var(--gris1); }
.teem-dir-row__ext {
  font-weight: 700; color: var(--morado);
  font-variant-numeric: tabular-nums;
}
/* Responsive directorio */
@media (max-width: 768px) {
  .teem-dir-group { grid-template-columns: 110px 1fr; min-height: 130px; }
}
@media (max-width: 480px) {
  .teem-dir-group { grid-template-columns: 1fr; min-height: auto; }
  .teem-dir-group__photo { height: 200px; }
}

/* ================================================================
   ORGANIGRAMA
================================================================ */
.teem-org {
  display: flex; flex-direction: column; align-items: center;
  gap: 1.5rem; margin: 2rem 0;
}
.teem-org__node {
  text-align: center; padding: 1rem 2rem;
  border-radius: var(--r-xl); font-size: var(--tx-sm);
  font-weight: 600; max-width: 280px; width: 100%;
}
.teem-org__node--pres {
  background: var(--morado); color: var(--white);
  font-size: var(--tx-base); font-weight: 700;
}
.teem-org__node--area {
  background: var(--morado-pale); color: var(--morado);
  border: 1.5px solid rgba(114,34,130,.2);
}
.teem-org__connector {
  width: 2px; height: 24px; background: var(--gris4);
}
.teem-org__row {
  display: flex; flex-wrap: wrap; justify-content: center;
  gap: .75rem; width: 100%;
}
.teem-org__row .teem-org__node {
  flex: 1; min-width: 200px; max-width: 240px;
  font-size: var(--tx-xs); padding: .75rem 1rem;
}

/* ================================================================
   TARJETAS DE PLATAFORMAS EXTERNAS
================================================================ */
.teem-platforms-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: .875rem; margin: 1.5rem 0 2.5rem;
}
.teem-platform-card {
  display: flex; align-items: flex-start; gap: 1rem;
  padding: 1.25rem; background: var(--white);
  border: 1.5px solid var(--gris4); border-radius: var(--r-xl);
  text-decoration: none; transition: all var(--tb) var(--ease);
  position: relative;
}
.teem-platform-card:hover {
  border-color: var(--morado-light); box-shadow: var(--sh-pur);
  transform: translateY(-3px);
}
.teem-platform-card__icon {
  width: 44px; height: 44px; border-radius: var(--r-md);
  background: var(--morado-pale); display: flex; align-items: center;
  justify-content: center; flex-shrink: 0; transition: background var(--tb);
}
.teem-platform-card__icon svg {
  width: 22px; height: 22px; stroke: var(--morado); fill: none;
  stroke-linecap: round; stroke-linejoin: round;
}
.teem-platform-card:hover .teem-platform-card__icon { background: var(--morado); }
.teem-platform-card:hover .teem-platform-card__icon svg { stroke: var(--white); }
.teem-platform-card__body { flex: 1; min-width: 0; }
.teem-platform-card__name {
  font-size: var(--tx-sm); font-weight: 700; color: var(--ink);
  line-height: 1.3; margin-bottom: .25rem;
}
.teem-platform-card__desc {
  font-size: var(--tx-xs); color: var(--gris2); line-height: 1.55;
}
.teem-platform-card__arrow {
  width: 16px; height: 16px; flex-shrink: 0;
  stroke: var(--gris3); transition: all var(--tf);
  margin-top: 2px;
}
.teem-platform-card:hover .teem-platform-card__arrow { stroke: var(--morado); transform: translate(2px, -2px); }

/* ================================================================
   BLOQUE INFOEM
================================================================ */
.teem-infoem-block {
  background: var(--morado-ghost); border: 1.5px solid var(--morado-pale);
  border-radius: var(--r-xl); padding: 1.75rem; margin: 2rem 0 2.5rem;
}
.teem-infoem-block__header {
  display: flex; align-items: flex-start; gap: 1rem;
  font-size: var(--tx-sm); color: var(--ink); line-height: 1.55;
  margin-bottom: 1.25rem; padding-bottom: 1rem;
  border-bottom: 1px solid rgba(114,34,130,.12);
}
.teem-infoem-block__header svg { stroke: var(--morado); flex-shrink: 0; }
.teem-infoem-block__links {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: .75rem;
}
.teem-infoem-block__links a {
  display: flex; align-items: center; gap: .625rem;
  padding: .75rem 1rem; font-size: var(--tx-sm); font-weight: 600;
  color: var(--morado); text-decoration: none;
  background: var(--white); border: 1px solid var(--morado-pale);
  border-radius: var(--r-lg); transition: all var(--tf);
}
.teem-infoem-block__links a:hover {
  background: var(--morado-pale); border-color: var(--morado-light);
  transform: translateY(-1px); box-shadow: var(--sh-xs);
}
.teem-infoem-block__links a svg { flex-shrink: 0; stroke: var(--morado); }

/* ================================================================
   RESPONSIVE
================================================================ */
@media (max-width: 1100px) {
  .teem-page-layout { grid-template-columns: 200px 1fr; gap: 2.5rem; }
  .teem-platforms-grid { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  .teem-page-hero { padding: 3rem 0 2.5rem; }
  .teem-page-layout { grid-template-columns: 1fr; gap: 0; }
  .teem-sidenav {
    position: static; flex-direction: row; flex-wrap: wrap;
    gap: .375rem; margin-bottom: 2rem;
    padding-bottom: 1.5rem; border-bottom: 1px solid var(--gris4);
  }
  .teem-sidenav__title { width: 100%; margin-bottom: .375rem; }
  .teem-sidenav__link {
    padding: .375rem .75rem; font-size: var(--tx-xs);
    border-left: none; border-radius: var(--r-pill);
    border: 1px solid var(--gris4);
  }
  .teem-sidenav__link--active {
    border-color: var(--morado); background: var(--morado-pale);
  }
  .teem-mag-grid { grid-template-columns: 1fr; }
  .teem-def-svc { flex-direction: column; }
  .teem-highlight { flex-direction: column; }
  .teem-platforms-grid { grid-template-columns: 1fr; }
  .teem-platform-card { flex-direction: row; }
  .teem-infoem-block__links { grid-template-columns: 1fr; }
  .teem-org__row { flex-direction: column; align-items: center; }
  .teem-org__row .teem-org__node { max-width: 100%; }
}
