/* ═══════════════════════════════════════════════════════════════
   Comités: composición editorial de nombres, cargos y áreas.
   Sin tarjetas voluminosas ni fotografías; la jerarquía la marcan
   la tipografía, los filetes y el ritmo vertical.
   ═══════════════════════════════════════════════════════════════ */

.comites-indice {
    border-bottom: 1px solid var(--linea);
    background: var(--hueso-claro);
}

.comites-indice ul {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 26px;
    margin: 0;
    padding: 18px 0;
    list-style: none;
}

.comites-indice a {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    color: var(--tinta);
    font-weight: 600;
    text-decoration-color: var(--morado);
    text-decoration-thickness: 2px;
    text-underline-offset: 4px;
}

.comites-indice a:hover {
    color: var(--morado);
}

.comites-seccion h2 {
    margin: 0 0 30px;
}

.comite-personas,
.comite-equipo {
    margin: 0;
}

.comite-personas--dos-columnas,
.comite-equipo {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 42px;
}

.comite-persona,
.comite-area {
    padding: 18px 0 20px;
    border-top: 1px solid var(--linea);
    break-inside: avoid;
}

.comite-persona dt,
.comite-area dt {
    color: var(--tinta);
    font-family: var(--font-headers);
    font-size: clamp(20px, 2.1vw, 25px);
    font-weight: 650;
    line-height: 1.16;
}

.comite-persona dd,
.comite-area dd {
    margin: 7px 0 0;
    color: var(--gris);
    font-size: var(--txt-menor);
    line-height: 1.5;
}

.comite-personas--destacada {
    max-width: 760px;
    padding: 4px 0 4px 24px;
    border-left: 5px solid var(--morado);
}

.comite-personas--destacada .comite-persona {
    padding: 14px 0;
    border-top: 0;
}

.comite-subseccion + .comite-subseccion {
    margin-top: 52px;
}

.comite-subseccion h3 {
    margin: 0 0 18px;
    color: var(--morado);
    font-size: clamp(25px, 3vw, 34px);
}

.comite-area dt {
    font-family: var(--font-body);
    font-size: var(--txt-base);
    font-weight: 700;
}

.comite-area dd {
    color: var(--tinta);
}

@media all and (max-width: 700px) {
    .comites-indice ul,
    .comite-personas--dos-columnas,
    .comite-equipo {
        grid-template-columns: 1fr;
    }

    .comites-indice ul {
        display: grid;
        gap: 9px 20px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .comite-persona,
    .comite-area {
        padding: 16px 0 18px;
    }
}

@media all and (max-width: 430px) {
    .comites-indice ul {
        grid-template-columns: 1fr;
    }
}
