How can I optimize the 'New in' collection banner for different screen sizes?

[polly5]

I’d like the ‘New in’ banner to go across the entire page, with it being able to adapt to the screen size. I also want the description (‘new released’) to be directly underneath the ‘new in’ banner within the pink background.

This is what I’ve got so far:

.collection-hero__title {
text-align: center;
background-color: #ffc2d2;
padding: 35px;
margin-bottom: 0rem;
}

.collection-hero__description {

}

As seen here: https://www.pollygoneillustration.com/collections/new

Thank you

[Dan-From-Ryviu]

Please use this code instead of

.collection-hero { background-color: #ffc2d2; }
.collection-hero .collection-hero__title { padding: 5px; }
.collection-hero .collection-hero__description { max-width: 100%; text-align: center; }