Засечки на шрифте выходят за пределы родительского блока

Есть:

1. Блок с относительным позиционированием;
2. В нём картинка;
3. Также в нём дочерний блок с абсолютным позиционированием и текстом.

Нужно, чтобы текст был справа снизу картинки. Сделать это просто, но вот засечки на некоторых буквах выходят за пределы рамки. Не хочется свойствам bottom и right добавлять пиксели и transform применять, а также менять шрифт. Есть ли другой выход?

<div class="image">
    <img src="https://im.wampi.ru/2022/11/27/bpv.jpg">         
    <div class="dishes">Утварь</div>
</div>

.image {
  position: relative;
}
.dishes {
  position: absolute;  
  bottom: 0;
  right: 0;
}