No conozco muy bien el diseño de cuadrícula. Dicho esto…
Si no muestras las descripciones de las categorías en absoluto, puedes reemplazar
.category-title-contents {
display: grid;
grid-template-areas:
"logo title"
"logo description";
grid-template-columns: auto 1fr;
}
con
.category-title-contents {
display: grid;
grid-template-areas:
"logo title";
grid-template-columns: auto 1fr;
}
El diseño original divide el contenedor en 4 celdas, lo que desalinea el título:
Eliminar el área “logo description” lo convierte en 2 celdas:
Lo que te permite alinear verticalmente el título reemplazando:
.category-title-contents .category-title {
grid-area: title;
align-self: end;
}
con
.category-title-contents .category-title {
grid-area: title;
align-self: center;
}


