I’m trying to create a product card that which has the title at the bottom. Sometimes the title is a bit longer and it needs to use two lines (it adds one at the top).
However it tries to fit as much text as possible on the first line, but I want as much text on the last line*
So I want this:
Standard behaviour
To be transformed to:
More text on the bottom line than on the top line

<div class="row-3-number">
  <div class="row-3-number-image">
    <div class="position-container position-container-3">3</div>
    <div class="row-3-number-gradient"></div>
    <span class="top-10-price top-10-old-price">€ 49,95</span>
    <span class="top-10-price">€ 38,95</span>
    <span class="row-3-number-title">Globe Whiskey Decanter</span>
    <img src="imagesglobe-decanter-hoofd_1.webp" alt="">
  </div>
  <p>Met deze indrukwekkende Globe Whiskey Decanter serveer je jouw favoriete  drankje in stijl.
    De glazen karaf heeft een luxe uitstraling een inhoud van maar liefst 0.9L!</p>
</div>

.top-10-price {
    position: absolute;
    bottom: 20px;
    right: 20px;
    height: 20px;
    font-size: 20px;
    color: #fff;
}

.top-10-old-price {
    bottom: 50px;
    text-decoration: line-through;
    color: rgba(255, 255, 255, .70);
}
[..]
.row-3-number {
    width: 350px;
    overflow: hidden;
}

.row-3-number > p {
    margin: 20px;
}

.row-3-number-image {
    width: 350px;
    height: 350px;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}

.row-3-number-image > img {
    width: 350px;
    height: 350px;
}

.row-3-number-title {
    position: absolute;
    bottom: 20px;
    left: 20px;
    width: 230px;
    color: #fff;
    font-size: 20px;
}

I really prefer to do this without the use of php or javascript.

I’ve tried to use text-align-last but that only shifted the last line over without actually giving it all the text.

*The reason I want this is because I have placed a gradient from black to opaque at the bottom so the text is always readable. The text at the bottom is slightly more readable than the line above it.