Quiero realizar un botón con un background en diagonal con dos colores. A su vez, el texto que está dentro de él también tiene que partirse en diagonal de la misma manera que el botón, es decir, si parte alguna letra por la mitad tiene que ser cada una de las partes de la letra de un color.
Aquí os dejo el CSS que tengo hasta ahora. Como veis, el texto no está a dos colores, tendría que respetar la diagonal del background del botón a dos colores:
.button{
background: linear-gradient(140deg, #00C9FF 35%, transparent 35%);
}
<button class="button">some long text</button>
¿Alguien sabe como solucionar esto con CSS?