/* ============================================================
   tech.css — 全站科技感增强（叠加层，不修改原有样式）
   主色系：#1296db / #2cd4d9 / #7ee8fa
   ============================================================ */

:root {
	--yg-cyan: #1296db;
	--yg-teal: #2cd4d9;
	--yg-ice: #7ee8fa;
	--yg-deep: #07203a;
}

/* ---------- 全局细节 ---------- */
::selection {
	background: rgba(18, 150, 219, 0.22);
	color: inherit;
}

html {
	scroll-behavior: smooth;
}

body::-webkit-scrollbar {
	width: 10px;
}

body::-webkit-scrollbar-track {
	background: #eef4f8;
}

body::-webkit-scrollbar-thumb {
	background: linear-gradient(180deg, #1296db, #2cd4d9);
	border-radius: 6px;
}

/* ---------- 顶部滚动进度条 ---------- */
#yg-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	width: 0;
	background: linear-gradient(90deg, #1296db, #2cd4d9, #7ee8fa);
	box-shadow: 0 0 12px rgba(44, 212, 217, 0.8);
	z-index: 99999;
	transition: width 0.08s linear;
	pointer-events: none;
}

/* ---------- 首页 Banner：科技蓝渐变遮罩 + 扫光 ---------- */
.banner_w3ls {
	position: relative;
	overflow: hidden;
}

.banner_w3ls::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 70% 55% at 78% 30%, rgba(44, 212, 217, 0.22), transparent 65%),
		radial-gradient(ellipse 60% 60% at 12% 85%, rgba(18, 150, 219, 0.28), transparent 60%),
		linear-gradient(100deg, rgba(5, 22, 42, 0.72) 0%, rgba(7, 32, 58, 0.42) 46%, rgba(10, 60, 96, 0.30) 100%);
	z-index: 1;
	pointer-events: none;
}

/* 扫光 */
.banner_w3ls::after {
	content: "";
	position: absolute;
	top: 0;
	left: -60%;
	width: 45%;
	height: 100%;
	background: linear-gradient(105deg, transparent 0%, rgba(126, 232, 250, 0.10) 45%, rgba(126, 232, 250, 0.16) 50%, rgba(126, 232, 250, 0.10) 55%, transparent 100%);
	transform: skewX(-12deg);
	animation: ygSweep 7s ease-in-out infinite;
	z-index: 2;
	pointer-events: none;
}

@keyframes ygSweep {
	0% { left: -60%; }
	55% { left: 120%; }
	100% { left: 120%; }
}

#yg-particles,
.yg-particles {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
	pointer-events: none;
}

.page_head .yg-particles {
	z-index: 1;
}

.banner_w3ls .callbacks_container {
	position: relative;
	z-index: 3;
}

/* Banner 文案玻璃面板 */
.banner_w3ls .banner-info {
	background: rgba(7, 28, 50, 0.46);
	backdrop-filter: blur(6px) saturate(140%);
	-webkit-backdrop-filter: blur(6px) saturate(140%);
	border: 1px solid rgba(126, 232, 250, 0.18);
	border-left: 3px solid transparent;
	border-image: linear-gradient(180deg, #7ee8fa, #1296db) 1;
	border-image-slice: 1;
	box-shadow: 0 24px 60px rgba(3, 16, 32, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.08);
	animation: ygPanelIn 1s ease 0.15s both;
}

@keyframes ygPanelIn {
	from { opacity: 0; transform: translateX(-26px); }
	to { opacity: 1; transform: none; }
}

/* 渐变流光大标题 */
.banner_w3ls .banner-text h3 {
	background: linear-gradient(90deg, #7ee8fa 0%, #ffffff 30%, #2cd4d9 60%, #7ee8fa 100%);
	background-size: 220% 100%;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	animation: ygShimmer 5s linear infinite;
	text-shadow: none;
	filter: drop-shadow(0 2px 10px rgba(44, 212, 217, 0.35));
	letter-spacing: 0.06em;
}

@keyframes ygShimmer {
	0% { background-position: 0% 0; }
	100% { background-position: -220% 0; }
}

.banner_w3ls .banner-text p {
	color: rgba(255, 255, 255, 0.88);
	text-shadow: 0 1px 8px rgba(3, 16, 32, 0.6);
}

/* ---------- 区块标题：深蓝渐变字 + 英文 kicker + 动感下划线 ---------- */
h3.title, h2.title {
	color: #0d2b4e;
	text-shadow: none;
	background: linear-gradient(180deg, #0f3358 0%, #1296db 140%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	letter-spacing: 0.05em;
	font-weight: 600;
}

.yg-kicker {
	display: block;
	margin-bottom: 10px;
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.52em;
	text-transform: uppercase;
	color: #2cd4d9;
	position: relative;
}

.yg-kicker::before,
.yg-kicker::after {
	content: "";
	display: inline-block;
	vertical-align: middle;
	width: 26px;
	height: 1px;
	background: linear-gradient(90deg, transparent, #2cd4d9);
	margin-right: 12px;
}

.yg-kicker::after {
	background: linear-gradient(90deg, #2cd4d9, transparent);
	margin-right: 0;
	margin-left: 12px;
}

h3.title::after, h2.title::after {
	background: linear-gradient(90deg, transparent, #1296db 20%, #2cd4d9 50%, #1296db 80%, transparent);
	width: 120px;
	height: 3px;
	animation: ygLineBreath 2.6s ease-in-out infinite;
}

@keyframes ygLineBreath {
	0%, 100% { opacity: 0.75; transform: scaleX(0.86); }
	50% { opacity: 1; transform: scaleX(1); }
}

/* ---------- 区块背景：科技网格 / 点阵 ---------- */
.services_agile {
	background:
		radial-gradient(rgba(18, 150, 219, 0.075) 1.2px, transparent 1.2px) 0 0 / 26px 26px,
		linear-gradient(180deg, #f7fafc 0%, #eef6fb 100%) !important;
}

.features_w3 {
	background:
		linear-gradient(rgba(18, 150, 219, 0.045) 1px, transparent 1px) 0 0 / 100% 34px,
		linear-gradient(90deg, rgba(18, 150, 219, 0.045) 1px, transparent 1px) 0 0 / 34px 100%,
		#ffffff;
}

/* ---------- 卡片：流光描边 + 聚光 hover ---------- */
.list-left,
.fea_grid1,
.fea_grid2,
.single-blog,
.single-block {
	position: relative;
	border-radius: 10px;
	transition: transform 0.35s ease, box-shadow 0.35s ease;
}

.list-left::before,
.fea_grid1::before,
.fea_grid2::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 10px;
	background: radial-gradient(360px circle at var(--mx, 50%) var(--my, 50%), rgba(44, 212, 217, 0.14), transparent 42%);
	opacity: 0;
	transition: opacity 0.4s ease;
	pointer-events: none;
	z-index: 0;
}

.list-left:hover::before,
.fea_grid1:hover::before,
.fea_grid2:hover::before {
	opacity: 1;
}

.list-left:hover,
.fea_grid1:hover,
.fea_grid2:hover {
	box-shadow:
		0 18px 44px rgba(18, 150, 219, 0.22),
		0 0 0 1px rgba(44, 212, 217, 0.35),
		0 0 26px rgba(44, 212, 217, 0.18);
}

.list-left > *,
.fea_grid1 > *,
.fea_grid2 > * {
	position: relative;
	z-index: 1;
}

/* 产品图圆角 */
.list-left .multi-gd-text img {
	border-radius: 8px;
}

/* ---------- 图标呼吸光环（display:block 保证 width:25% 按全宽计算） ---------- */
.services_agile .list-left > span {
	position: relative;
	display: block;
}

.services_agile .list-left > span::after {
	content: "";
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 25%;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	border: 2px solid rgba(44, 212, 217, 0.4);
	animation: ygPulse 2.4s ease-out infinite;
	pointer-events: none;
}

.services_agile .list-left span img {
	transition: transform 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease;
}

.services_agile .list-left:hover span img {
	transform: translateY(-4px) scale(1.04);
	border-color: rgba(44, 212, 217, 0.75);
	box-shadow: 0 0 26px rgba(44, 212, 217, 0.35);
}

@keyframes ygPulse {
	0% { transform: scale(0.82); opacity: 0.9; }
	70% { transform: scale(1.18); opacity: 0; }
	100% { transform: scale(1.18); opacity: 0; }
}

/* 管线圆图旋转光环强化 */
.ih-item.circle.effect1 .spinner {
	border-color: rgba(44, 212, 217, 0.6) rgba(18, 150, 219, 0.25) rgba(44, 212, 217, 0.6) rgba(18, 150, 219, 0.25);
}

/* ---------- 页脚：深空科技渐变 ---------- */
.contact_w3agile {
	position: relative;
	overflow: hidden;
}

.contact_w3agile::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 55% 80% at 85% 20%, rgba(44, 212, 217, 0.16), transparent 60%),
		radial-gradient(ellipse 50% 70% at 10% 90%, rgba(18, 150, 219, 0.22), transparent 55%),
		linear-gradient(120deg, rgba(5, 22, 42, 0.82) 0%, rgba(7, 32, 58, 0.68) 55%, rgba(8, 44, 74, 0.78) 100%);
	pointer-events: none;
}

.contact_w3agile .container {
	position: relative;
	z-index: 1;
}

/* 页脚顶部发光分隔线 */
.contact_w3agile {
	border-top: 1px solid transparent;
	border-image: linear-gradient(90deg, transparent, #2cd4d9 30%, #7ee8fa 50%, #2cd4d9 70%, transparent) 1;
}

/* ---------- 导航下划线：原生 ::before 渐变化（不新增线条，避免重复） ---------- */
.navbar-default .navbar-nav > li > a::before {
	background: linear-gradient(90deg, #1296db, #2cd4d9) !important;
}

/* ---------- 返回顶部：渐变 ---------- */
#toTop {
	background: linear-gradient(135deg, #1296db, #2cd4d9) !important;
}

/* ---------- 产品卡：白卡容器化 ---------- */
.services_agile .list-left {
	background: #fff;
	padding: 30px 24px 34px;
	border: 1px solid rgba(18, 150, 219, 0.10);
	box-shadow: 0 12px 34px rgba(10, 40, 80, 0.07);
}

.services_agile .list-left h4 {
	font-size: 22px;
	font-weight: 600;
	color: #0d2b4e;
	letter-spacing: 0.05em;
	margin: 20px 0 22px;
}

/* ---------- Banner 文案细节 ---------- */
.banner_w3ls .banner-text p::before {
	content: "";
	display: block;
	width: 54px;
	height: 3px;
	margin-bottom: 18px;
	border-radius: 2px;
	background: linear-gradient(90deg, #7ee8fa, #2cd4d9);
}

/* ---------- 关于我们 / 管线区文字升级 ---------- */
.btm-right-grid h2 {
	color: #0d2b4e;
	letter-spacing: 0.04em;
}

.features_w3 .fea_grid1 h4,
.features_w3 .fea_grid2 h4 {
	color: #0d2b4e;
	font-weight: 600;
	letter-spacing: 0.03em;
}

.features_w3 .fea_grid1 p,
.features_w3 .fea_grid2 p {
	color: #1296db;
	letter-spacing: 0.08em;
}

/* ---------- HUD 四角瞄准框（卡片悬停 / Banner 面板） ---------- */
.list-left::after,
.fea_grid1::after,
.fea_grid2::after {
	content: "";
	position: absolute;
	inset: 8px;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.35s ease;
	background:
		linear-gradient(#2cd4d9, #2cd4d9) left 0 top 0 / 20px 2px,
		linear-gradient(#2cd4d9, #2cd4d9) left 0 top 0 / 2px 20px,
		linear-gradient(#2cd4d9, #2cd4d9) right 0 top 0 / 20px 2px,
		linear-gradient(#2cd4d9, #2cd4d9) right 0 top 0 / 2px 20px,
		linear-gradient(#2cd4d9, #2cd4d9) left 0 bottom 0 / 20px 2px,
		linear-gradient(#2cd4d9, #2cd4d9) left 0 bottom 0 / 2px 20px,
		linear-gradient(#2cd4d9, #2cd4d9) right 0 bottom 0 / 20px 2px,
		linear-gradient(#2cd4d9, #2cd4d9) right 0 bottom 0 / 2px 20px;
	background-repeat: no-repeat;
}

.list-left:hover::after,
.fea_grid1:hover::after,
.fea_grid2:hover::after {
	opacity: 1;
}

.banner_w3ls .banner-info::after {
	content: "";
	position: absolute;
	inset: 10px;
	pointer-events: none;
	opacity: 0.55;
	background:
		linear-gradient(#7ee8fa, #7ee8fa) left 0 top 0 / 22px 2px,
		linear-gradient(#7ee8fa, #7ee8fa) left 0 top 0 / 2px 22px,
		linear-gradient(#7ee8fa, #7ee8fa) right 0 top 0 / 22px 2px,
		linear-gradient(#7ee8fa, #7ee8fa) right 0 top 0 / 2px 22px,
		linear-gradient(#7ee8fa, #7ee8fa) left 0 bottom 0 / 22px 2px,
		linear-gradient(#7ee8fa, #7ee8fa) left 0 bottom 0 / 2px 22px,
		linear-gradient(#7ee8fa, #7ee8fa) right 0 bottom 0 / 22px 2px,
		linear-gradient(#7ee8fa, #7ee8fa) right 0 bottom 0 / 2px 22px;
	background-repeat: no-repeat;
}

/* ---------- 标题巨型英文水印 ---------- */
.yg-watermark {
	position: absolute;
	left: 0;
	right: 0;
	top: -44px;
	text-align: center;
	font-size: 92px;
	font-weight: 800;
	letter-spacing: 0.1em;
	white-space: nowrap;
	line-height: 1;
	color: transparent;
	-webkit-text-stroke: 1px rgba(18, 150, 219, 0.12);
	pointer-events: none;
	user-select: none;
	z-index: 0;
}

h3.title, h2.title {
	position: relative;
	z-index: 1;
}

/* ---------- 首页科技数据条 ---------- */
.yg-stats {
	position: relative;
	overflow: hidden;
	padding: 54px 0 46px;
	background:
		radial-gradient(rgba(126, 232, 250, 0.08) 1px, transparent 1px) 0 0 / 24px 24px,
		linear-gradient(115deg, #05182a 0%, #0a3a5c 52%, #062b47 100%);
}

.yg-stats::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, #2cd4d9 30%, #7ee8fa 50%, #2cd4d9 70%, transparent);
}

.yg-stats::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, #2cd4d9 30%, #7ee8fa 50%, #2cd4d9 70%, transparent);
}

.yg-stat {
	text-align: center;
	padding: 10px 0;
}

.yg-stat strong {
	display: block;
	font-size: 46px;
	font-weight: 700;
	line-height: 1.15;
	background: linear-gradient(180deg, #ffffff 20%, #7ee8fa 90%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	filter: drop-shadow(0 0 18px rgba(44, 212, 217, 0.35));
	font-variant-numeric: tabular-nums;
}

.yg-stat span {
	display: block;
	margin-top: 10px;
	font-size: 14px;
	letter-spacing: 0.22em;
	color: rgba(214, 240, 250, 0.78);
}

@media (max-width: 768px) {
	.yg-watermark {
		font-size: 44px;
		top: -24px;
		-webkit-text-stroke-width: 0.8px;
	}

	.yg-stat strong { font-size: 34px; }
	.yg-stat span { font-size: 12px; letter-spacing: 0.12em; }
	.yg-stats { padding: 34px 0 28px; }
}

/* ---------- 内页 page_head ---------- */
.page_head::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse 60% 70% at 80% 20%, rgba(44, 212, 217, 0.20), transparent 60%),
		linear-gradient(90deg, rgba(5, 22, 42, 0.45), rgba(7, 32, 58, 0.25));
	z-index: 0;
	pointer-events: none;
}

.page_head .page-head-caption {
	z-index: 2;
}

.page-head-caption span {
	color: var(--yg-ice);
	position: relative;
	padding-left: 34px;
}

.page-head-caption span::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 22px;
	height: 2px;
	transform: translateY(-50%);
	background: linear-gradient(90deg, #2cd4d9, transparent);
}

/* ---------- 移动端 ---------- */
@media (max-width: 768px) {
	.banner_w3ls .banner-info {
		border-image: none;
		border-left: 3px solid #2cd4d9;
	}
}

/* ---------- 无动画偏好 ---------- */
@media (prefers-reduced-motion: reduce) {
	.banner_w3ls::after,
	.banner_w3ls .banner-info,
	.banner_w3ls .banner-text h3,
	.services_agile .list-left > span::after,
	h3.title::after, h2.title::after {
		animation: none !important;
	}

	.banner_w3ls .banner-text h3 {
		background: none;
		-webkit-text-fill-color: currentColor;
		color: #1296db;
	}

	h3.title, h2.title {
		background: none;
		-webkit-text-fill-color: currentColor;
		color: #1296db;
	}

	#yg-particles {
		display: none;
	}
}