.contact-cards{

	padding:120px 0;

	background:#ffffff;

	position:relative;

}

.section-header{

	max-width:760px;

	margin:auto;

	text-align:center;

	margin-bottom:80px;

}

.section-tag{

	display:inline-flex;

	padding:10px 20px;

	border:1px solid #e4e4e4;

	border-radius:100px;

	font-size:13px;

	letter-spacing:.18em;

	margin-bottom:24px;

}

.section-header h2{

	font-size:62px;

	font-weight:800;

	line-height:.95;

	margin-bottom:30px;

}

.section-header h2 span{

	display:block;

	background:linear-gradient(
		90deg,
		#4F7DFF,
		#8D63FF,
		#FF8B4D
	);

	-webkit-background-clip:text;

	color:transparent;

}

.section-header p{

	font-size:19px;

	line-height:1.9;

	color:#666;

	max-width:650px;

	margin:auto;

}

.cards-grid{

	display:grid;

	grid-template-columns:repeat(3,1fr);

	gap:30px;

}

.contact-card{

	background:#fafaf8;

	border:1px solid #ececec;

	border-radius:24px;

	padding:45px;

	transition:.4s;

	position:relative;

	overflow:hidden;

}

.contact-card::before{

	content:"";

	position:absolute;

	left:0;

	top:0;

	width:0;

	height:3px;

	background:linear-gradient(
		90deg,
		#4F7DFF,
		#8D63FF,
		#FF8B4D
	);

	transition:.45s;

}

.contact-card:hover::before{

	width:100%;

}

.contact-card:hover{

	transform:translateY(-8px);

	box-shadow:
	0 25px 60px rgba(0,0,0,.08);

}

.icon{

	width:70px;

	height:70px;

	border-radius:18px;

	background:#fff;

	display:flex;

	align-items:center;

	justify-content:center;

	font-size:30px;

	margin-bottom:28px;

	border:1px solid #ececec;

}

.contact-card h3{

	font-size:28px;

	margin-bottom:18px;

}

.contact-card a,
.contact-card strong{

	display:block;

	font-size:19px;

	color:#111;

	text-decoration:none;

	margin-bottom:18px;

}

.contact-card p{

	color:#777;

	line-height:1.8;

	margin:0;

}

@media(max-width:992px){

.cards-grid{

grid-template-columns:1fr;

}

.section-header h2{

font-size:48px;

}

.contact-card{

padding:35px;

}

}