.portfolio-hero{
	padding:110px 0 50px;
	background:linear-gradient(135deg,#111824 0%,#1d2633 70%,#223041 100%);
	color:#fff;
	text-align:center;
}
.portfolio-hero h1{
	font-size:3rem;
	font-weight:700;
	margin-bottom:.3rem;
	letter-spacing:-.02em;
}
.portfolio-hero p{
	font-size:1.15rem;
	color:rgba(255,255,255,.85);
	margin:0;
}
.portfolio-intro{
	padding:46px 0 18px;
	background:#f7f9fc;
}
.portfolio-intro p{
	max-width:900px;
	margin:0 auto;
	font-size:1.05rem;
	line-height:1.9;
	text-align:center;
	color:#333;
}
.portfolio-gallery{
	padding:30px 0 70px;
	background:#f7f9fc;
}
.portfolio-card{
	background:#fff;
	border-radius:16px;
	overflow:hidden;
	box-shadow:0 12px 30px rgba(17,24,39,.12);
	transition:transform .25s ease,box-shadow .25s ease;
}
.portfolio-card img{
	width:100%;
	height:290px;
	object-fit:cover;
	display:block;
}
.portfolio-card:hover{
	transform:translateY(-6px);
	box-shadow:0 18px 40px rgba(17,24,39,.16);
}
.portfolio-pagination{
	display:flex;
	justify-content:center;
	gap:10px;
	margin-top:28px;
}
.portfolio-pagination span{
	width:38px;
	height:38px;
	line-height:38px;
	text-align:center;
	border-radius:999px;
	border:1px solid #d7deea;
	background:#fff;
	color:#29374a;
	font-weight:600;
}
.portfolio-pagination .active{
	background:#b60101;
	border-color:#b60101;
	color:#fff;
}
@media(max-width:767px){
	.portfolio-hero{
		padding:90px 0 40px;
	}
	.portfolio-hero h1{
		font-size:2.2rem;
	}
	.portfolio-card img{
		height:240px;
	}
}