A hero section with centered model image with title texts

<div class="row gray-bg">
	<div class="container">
		<div class="d-row">
			<div class="image-wrap">
				<div class="boxed-content">
					<h2>Sun Glass</h2>
					<p>collections</p>
				</div>
			</div>
		</div>
	</div>
</div>
.container{
	width:1160px;
	max-width:90%;
	margin:20px auto
}
.gray-bg{
	background-color:#e7dfdc
}
.d-row{
	background:url(https://pixelthemes.com/wp-content/uploads/2023/12/model.jpg) no-repeat center;
}
.image-wrap{
	position:relative;
	max-width:450px;
	margin:auto;
	height:400px
}
.image-wrap img{
	vertical-align:bottom
}
.boxed-content{
	position:absolute;
	bottom:0;
	right:0;
	padding:0 54px 20px;
	box-sizing:border-box;
	font-family:'Sacramento', cursive;
	font-size:3em;
	color: #fff;
	background-color: #b3a4c8;
	letter-spacing:.02em
}
.boxed-content h2{
	font-family: 'Playfair Display', serif;
	font-size:0.8em;
	text-transform:uppercase;
	color:#000;
	margin: 0 0 -25%;
	transform: translateY(-50%);
	letter-spacing:0;
	white-space:nowrap
}
.boxed-content p{
	margin:0;
	position:relative
}
@media(max-width:768px){
	.boxed-content{
		padding:0 20px 20px
	}
}

Demo here…