html, body, p, li, a, button, input, textarea,
h1, h2, h3, h4, h5, h6,
.navbar-default .navbar-nav > li > a {
	font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", "Noto Sans SC", sans-serif;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
	outline: 2px solid #1296db;
	outline-offset: 3px;
}

.header_w3l {
	background: rgba(255, 255, 255, 0.78);
	backdrop-filter: saturate(160%) blur(16px);
	-webkit-backdrop-filter: saturate(160%) blur(16px);
	box-shadow: 0 1px 0 rgba(18, 150, 219, 0.08);
	transition: box-shadow 0.3s ease, background 0.3s ease, padding 0.3s ease;
}

.header_w3l.is-scrolled {
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 10px 30px rgba(8, 30, 60, 0.1);
	padding-top: 0.45em;
	padding-bottom: 0.2em;
}

.navbar-default .navbar-nav > li > a {
	transition: color 0.3s ease, transform 0.3s ease;
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus,
.navbar-default .navbar-nav li a.active {
	transform: translateY(-2px);
}

.page_head {
	position: relative;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
}

.page_head::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(6, 20, 40, 0.08) 10%, rgba(6, 20, 40, 0.62) 100%);
	pointer-events: none;
}

.page-head-caption {
	position: relative;
	z-index: 1;
	color: #fff;
	padding: 0 8vw 36px;
	animation: ygRise 0.8s ease both;
}

.page-head-caption span {
	display: block;
	letter-spacing: 0.38em;
	font-size: 12px;
	color: #8eebf0;
}

.page-head-caption strong {
	display: block;
	margin-top: 8px;
	font-size: 36px;
	font-weight: 600;
	letter-spacing: 0.08em;
}

@keyframes ygRise {
	from { opacity: 0; transform: translateY(18px); }
	to { opacity: 1; transform: none; }
}

h3.title, h2.title {
	position: relative;
	letter-spacing: 0.06em;
}

h3.title::after, h2.title::after {
	content: "";
	display: block;
	width: 46px;
	height: 3px;
	margin: 14px auto 0;
	border-radius: 3px;
	background: linear-gradient(90deg, #1296db, #2cd4d9);
}

.list-left,
.single-blog,
.single-block,
.fea_grid1,
.fea_grid2,
.contact-grid,
.cntl-content,
.custom-logo {
	transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.list-left:hover,
.single-blog:hover,
.single-block:hover,
.fea_grid1:hover,
.fea_grid2:hover,
.contact-grid:hover,
.cntl-state:hover .cntl-content,
.custom-logo:hover {
	transform: translateY(-8px);
	box-shadow: 0 18px 40px rgba(10, 40, 80, 0.12);
}

.multi-gd-text,
.image-scale,
.single-block,
.cntl-image {
	overflow: hidden;
}

.multi-gd-text img,
.image-scale img,
.single-block img,
.cntl-image img {
	transition: transform 0.6s ease;
}

.list-left:hover .multi-gd-text img,
.single-blog:hover .image-scale img,
.single-block:hover img,
.cntl-state:hover .cntl-image img {
	transform: scale(1.06);
}

.blog-btn,
.navbar-toggle,
.contact-grid p a {
	transition: color 0.3s ease, background 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}

.yg-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 0.7s ease, transform 0.7s ease;
}

.yg-reveal.is-visible {
	opacity: 1;
	transform: none;
}

.contact_w3agile .container {
	line-height: 1.9;
}

.contact_w3agile a {
	transition: color 0.3s ease, opacity 0.3s ease;
}

.contact_w3agile a:hover {
	opacity: 0.8;
}

#toTop {
	width: 48px;
	height: 48px;
	right: 22px;
	bottom: 22px;
	border-radius: 50%;
	text-indent: 0;
	background: #1296db !important;
	box-shadow: 0 10px 24px rgba(18, 150, 219, 0.35);
	z-index: 7000;
	transition: background 0.3s ease, transform 0.3s ease;
}

#toTop::before {
	content: "";
	position: absolute;
	left: 17px;
	top: 20px;
	width: 12px;
	height: 12px;
	border-top: 2px solid #fff;
	border-left: 2px solid #fff;
	transform: rotate(45deg);
}

#toTop:hover {
	background: #0b7ec0 !important;
	transform: translateY(-3px);
}

#toTopHover {
	display: none;
}

@media (max-width: 768px) {
	.navbar-default .navbar-nav > li > a:hover,
	.navbar-default .navbar-nav > li > a:focus,
	.navbar-default .navbar-nav li a.active {
		transform: none;
	}

	.page-head-caption strong { font-size: 26px; }
	.page-head-caption { padding-bottom: 24px; }
}

@media (prefers-reduced-motion: reduce) {
	.yg-reveal,
	.page-head-caption {
		opacity: 1;
		transform: none;
		animation: none;
		transition: none;
	}
}