Fiz como está no exercício, mas não estou tendo o mesmo resultado.
.titulo-principal {
background-image: linear-gradient(to bottom, #F00, #888 70%, #000);
background-size: 100%, 200px;
}
O gradiente não ocupa os 200px definidos, ele continua ocupando toda a altura do elemento.