/* ========== 蓝白科技风格变量 ========== */
			:root {
				--c-bg: #f4f8ff;
				--c-white: #ffffff;
				--c-blue: #0066ff;
				--c-blue-light: #0088ff;
				--c-blue-dark: #004ecc;
				--c-blue-bg: rgba(0, 102, 255, .06);
				--c-blue-bg2: rgba(0, 136, 255, .04);
				--c-border: rgba(0, 102, 255, .1);
				--c-border-light: rgba(0, 102, 255, .06);
				--c-text: #1a2a4a;
				--c-text2: #4a6a8a;
				--c-text3: rgba(26, 42, 74, .45);
			}

			/* ========== 全局装饰背景 ========== */
			body {
				background: var(--c-bg);
			}

			body::before {
				content: '';
				position: fixed;
				inset: 0;
				background: radial-gradient(ellipse at 20% 0%, rgba(0, 136, 255, .06) 0%, transparent 60%), radial-gradient(ellipse at 80% 100%, rgba(0, 102, 255, .04) 0%, transparent 50%);
				pointer-events: none;
				z-index: 0;
			}

			body::after {
				content: '';
				position: fixed;
				top: 0;
				left: 0;
				right: 0;
				height: 100vh;
				background-image: linear-gradient(rgba(0, 102, 255, .03) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 102, 255, .03) 1px, transparent 1px);
				background-size: 80px 80px;
				pointer-events: none;
				z-index: 0;
				mask-image: linear-gradient(180deg, black 0%, transparent 100%);
				-webkit-mask-image: linear-gradient(180deg, black 0%, transparent 100%);
			}

			/* ========== 导航栏透明效果（首页顶部） ========== */
			.navbar:not(.scrolled) {
				background: transparent !important;
				border-bottom-color: transparent !important;
				box-shadow: none !important;
			}

			.navbar:not(.scrolled) .nav-links a {
				color: rgba(0, 0, 0, 0.9);
			}

			.navbar:not(.scrolled) .drop-menu li a {
				color: #1a2a4a;
			}

			.navbar:not(.scrolled) .drop-menu li a:hover {
				color: var(--c-blue);
			}

			.navbar:not(.scrolled) .nav-links a:hover,
			.navbar:not(.scrolled) .nav-links a.active {
				color: #0066ff;
			}

			.navbar:not(.scrolled) .nav-links a.active span::after {
				background: #0066ff;
			}

			.navbar:not(.scrolled) .nav-toggle span {
				background: #fff;
			}

			.navbar:not(.scrolled) .nav-logo {
				color: #fff;
			}

			.navbar.scrolled {
				background: rgba(255, 255, 255, .95) !important;
				backdrop-filter: blur(12px);
				-webkit-backdrop-filter: blur(12px);
				box-shadow: 0 2px 8px rgba(0, 102, 255, .06) !important;
				border-bottom-color: rgba(0, 102, 255, .1) !important;
			}

			/* ========== 全局滚动捕捉 ========== */
			html {
				scroll-snap-type: y proximity;
				scroll-behavior: smooth;
			}

			.snap-section {
				scroll-snap-align: start;
				
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
				overflow: hidden;
			}

			.snap-section.hero-snap {
				align-items: stretch;
			}

			/* 模块级入场动画 */
			@keyframes sectionSlideUp {
				from {
					opacity: 0;
					transform: translateY(70px);
				}

				to {
					opacity: 1;
					transform: translateY(0);
				}
			}

			.snap-section .section-inner {
				width: 100%;
				opacity: 1;
			}

			.snap-section.visible .section-inner {
				animation-play-state: running;
			}

			/* 侧边滚动导航点 */
			.scroll-nav {
				position: fixed;
				right: 18px;
				top: 50%;
				transform: translateY(-50%);
				z-index: 100;
				display: flex;
				flex-direction: column;
				gap: 14px;
			}

			.scroll-nav .sn-dot {
				width: 10px;
				height: 10px;
				border-radius: 50%;
				background: rgba(255, 255, 255, .35);
				border: 2px solid rgba(255, 255, 255, .5);
				cursor: pointer;
				transition: all .4s;
				position: relative;
			}

			.scroll-nav .sn-dot.active {
				background: #0088ff;
				border-color: #0088ff;
				box-shadow: 0 0 12px rgba(0, 136, 255, .6);
				transform: scale(1.4);
			}

			.scroll-nav .sn-dot:hover {
				background: #0088ff;
				border-color: #0088ff;
			}

			.scroll-nav .sn-tooltip {
				position: absolute;
				right: 24px;
				top: 50%;
				transform: translateY(-50%);
				white-space: nowrap;
				font-size: .75rem;
				color: #fff;
				background: rgba(0, 102, 255, .9);
				padding: 5px 14px;
				border-radius: 14px;
				opacity: 0;
				pointer-events: none;
				transition: opacity .3s;
			}

			.sn-dot:hover .sn-tooltip {
				opacity: 1;
			}

			/* ========== 全屏轮播图 ========== */
			.hero-carousel {
				position: relative;
				width: 100%;
				height: 100vh;
				height: 100svh;
				overflow: hidden;
				margin-top: 0;
			}

			.hero-slides {
				position: relative;
				width: 100%;
				height: 100%;
				overflow: hidden;
				background: #eaf3ff;
			}

			/* 底层：当前图片的模糊延展，用来填满图片未覆盖的区域。
			   这样图片可以完整等比显示（不裁切、不拉伸），也不会出现空白边。
			   关键点：模糊层与图片同形（不做 cover 裁切），再加大模糊半径，
			   这样四周的色调与图片边缘完全一致，左右两侧不会出现明显的拼接色块，
			   图片与背景自然融为一体，不会显得图片"贴在"中间 */
			.hero-slides::before {
				content: '';
				position: absolute;
				inset: -70px;
				background-size: 100% 100%;
				background-position: center;
				/* 去掉提亮与增艳，让两侧更柔和、不抢眼 */
				filter: blur(60px) saturate(.95) brightness(1.02);
				z-index: 0;
			}

			.hero-slides:has(> img.hero-slide.active[src$="banner1.jpg"])::before {
				background-image: url('../img/banner1.jpg');
			}

			.hero-slides:has(> img.hero-slide.active[src$="Carousel.jpg"])::before {
				background-image: url('../img/Carousel.jpg');
			}

			.hero-slides:has(> img.hero-slide.active[src$="05.jpg"])::before {
				background-image: url('../img/05.jpg');
			}

			.hero-slide {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				/* 等比完整显示：既不裁切，也不拉伸变形 */
				object-fit: contain;
				object-position: center;
				opacity: 0;
				/* 只做淡入淡出，去掉缩放，避免"拉伸/推拉"的观感 */
				transition: opacity 1.1s ease;
				z-index: 1;
			}

			.hero-slide.active {
				opacity: 1;
				z-index: 2;
			}

			.hero-slide.prev {
				opacity: 0;
				z-index: 1;
			}

			/* 屏幕比图片更"宽"时，图片左右两侧会出现填充区域：
			   把图片左右边缘做羽化（柔和晕开）过渡到模糊底层里，
			   消除拼接的硬边，图片与背景彻底融为一体，不再像"贴"在中间的一块图。
			   calc() 依据视口与图片比例算出填充宽度，只在填充区内渐变 */
			@media (min-aspect-ratio: 179/100) {
				img.hero-slide {
					-webkit-mask-image: linear-gradient(90deg,
						rgba(0, 0, 0, 0) 0,
						rgba(0, 0, 0, 0) calc((100vw - 178.48vh) / 2),
						#000 calc((100vw - 178.48vh) / 2 + 110px),
						#000 calc(100% - (100vw - 178.48vh) / 2 - 110px),
						rgba(0, 0, 0, 0) calc(100% - (100vw - 178.48vh) / 2));
					mask-image: linear-gradient(90deg,
						rgba(0, 0, 0, 0) 0,
						rgba(0, 0, 0, 0) calc((100vw - 178.48vh) / 2),
						#000 calc((100vw - 178.48vh) / 2 + 110px),
						#000 calc(100% - (100vw - 178.48vh) / 2 - 110px),
						rgba(0, 0, 0, 0) calc(100% - (100vw - 178.48vh) / 2));
				}
			}

			/* 左侧柔光：统一不同图片的明暗，让文案更清晰、图文更协调 */
			.hero-carousel::after {
				content: '';
				position: absolute;
				inset: 0;
				background: linear-gradient(90deg, rgba(255, 255, 255, .45) 0%, rgba(255, 255, 255, .18) 34%, rgba(255, 255, 255, 0) 58%);
				pointer-events: none;
				z-index: 3;
			}

			/* 视频背景 */
			video.hero-slide {
				object-fit: cover;
				object-position: center;
			}

			.hero-overlay {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background: linear-gradient(135deg, rgba(0, 30, 80, .75) 0%, rgba(0, 50, 120, .45) 50%, rgba(0, 30, 80, .7) 100%);
				z-index: 3;
			}

			/* 业务板块浮动图 */
			.hero-float-diagram {
				position: absolute;
				top: 50%;
				right: 0;
				transform: translateY(-50%);
				z-index: 3;
				width: 62vw;
				max-width: 840px;
				animation: heroFloatDiagram 4s ease-in-out infinite;
				pointer-events: none;
				opacity: 1;
				transition: opacity .8s ease;
			}

			.hero-float-diagram.hide {
				opacity: 0;
				pointer-events: none;
			}

			.hero-float-diagram::before {
				content: '';
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				width: 100%;
				height: 100%;
				background: radial-gradient(ellipse at center, rgba(100, 180, 255, 0.18) 0%, rgba(60, 140, 255, 0.08) 40%, transparent 70%);
				border-radius: 50%;
				z-index: -1;
				filter: blur(24px);
			}

			.hero-float-diagram img {
				width: 100%;
				height: auto;
				display: block;
				mix-blend-mode: normal;
				filter: none;
			}

			@keyframes heroFloatDiagram {

				0%,
				100% {
					transform: translateY(-50%) translateZ(0);
				}

				50% {
					transform: translateY(calc(-50% - 18px)) translateZ(0);
				}
			}

			.hero-text {
				position: absolute;
				top: 50%;
				left: 8%;
				transform: translateY(-50%);
				z-index: 4;
				max-width: 640px;
				opacity: 0;
				visibility: hidden;
				transition: opacity .9s ease, visibility .9s ease;
			}

			.hero-text.active {
				opacity: 1;
				visibility: visible;
			}

			.hero-text .hero-badge-sm {
				display: inline-block;
				padding: 8px 22px;
				background: rgba(0, 136, 255, .2);
				border: 1px solid rgba(0, 136, 255, .4);
				border-radius: 30px;
				font-size: .88rem;
				color: #0088ff;
				letter-spacing: 2px;
				margin-bottom: 28px;
				animation: fadeInUp .8s ease backwards;
			}

			.hero-text h1 {
				font-size: 3.6rem;
				font-weight: 700;
				color: #fff;
				line-height: 1.22;
				margin-bottom: 22px;
				letter-spacing: -.5px;
				animation: fadeInUp .8s .15s ease backwards;
			}

			.hero-text h1 .hl {
				color: #0088ff;
			}

			.hero-text .hero-desc {
				font-size: 1.12rem;
				color: #0088ff;
				line-height: 1.85;
				margin-bottom: 36px;
				max-width: 520px;
				animation: fadeInUp .8s .3s ease backwards;
			}

			.hero-text .hero-btns {
				display: flex;
				gap: 16px;
				flex-wrap: wrap;
				animation: fadeInUp .8s .45s ease backwards;
			}

			.hero-text .hero-btns .btn-h {
				display: inline-block;
				padding: 15px 38px;
				font-size: 1rem;
				font-weight: 600;
				border-radius: 4px;
				text-decoration: none;
				transition: all .35s;
			}

			.hero-text .btn-h-primary {
				background: linear-gradient(135deg, #0066ff, #0088ff);
				color: #fff;
				box-shadow: 0 6px 24px rgba(0, 136, 255, .3);
			}

			.hero-text .btn-h-primary:hover {
				transform: translateY(-3px);
				box-shadow: 0 10px 32px rgba(0, 136, 255, .45);
			}

			.hero-text .btn-h-outline {
				border: 2px solid rgba(255, 255, 255, .55);
				color: #fff;
				background: transparent;
			}

			.hero-text .btn-h-outline:hover {
				background: #fff;
				color: #1a2a4a;
				border-color: #fff;
				transform: translateY(-3px);
			}

			/* 轮播导航 */
			.hero-nav-dots {
				position: absolute;
				bottom: 40px;
				left: 50%;
				transform: translateX(-50%);
				z-index: 5;
				display: flex;
				gap: 14px;
			}

			.hero-nav-dots .dot {
				width: 12px;
				height: 12px;
				border-radius: 50%;
				background: rgba(255, 255, 255, .4);
				cursor: pointer;
				transition: all .4s;
				border: 2px solid transparent;
			}

			.hero-nav-dots .dot.active {
				background: #0088ff;
				border-color: #0088ff;
				transform: scale(1.3);
				box-shadow: 0 0 14px rgba(0, 136, 255, .6);
			}

			.hero-nav-dots .dot:hover {
				background: rgba(255, 255, 255, .7);
			}

			/* 箭头 */
			.hero-arrow {
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				z-index: 5;
				width: 52px;
				height: 52px;
				border-radius: 50%;
				background: rgba(255, 255, 255, .12);
				border: 1px solid rgba(255, 255, 255, .25);
				color: #fff;
				font-size: 1.4rem;
				cursor: pointer;
				display: flex;
				align-items: center;
				justify-content: center;
				transition: all .35s;
				backdrop-filter: blur(6px);
			}

			.hero-arrow:hover {
				background: rgba(255, 255, 255, .22);
				border-color: rgba(255, 255, 255, .5);
				transform: translateY(-50%) scale(1.1);
			}

			.hero-arrow--prev {
				left: 28px;
			}

			.hero-arrow--next {
				right: 28px;
			}

			/* 进度条 */
			.hero-progress {
				position: absolute;
				bottom: 0;
				left: 0;
				height: 3px;
				background: linear-gradient(90deg, #0066ff, #0088ff);
				z-index: 5;
				transition: width .1s linear;
			}

			/* 滚动指示器 */
			.hero-scroll-hint {
				position: absolute;
				bottom: 20px;
				left: 50%;
				transform: translateX(-50%);
				z-index: 5;
				display: flex;
				flex-direction: column;
				align-items: center;
				gap: 8px;
				animation: bounce 2s infinite;
				cursor: pointer;
			}

			.hero-scroll-hint span {
				font-size: .8rem;
				color: rgba(255, 255, 255, .55);
				letter-spacing: 2px;
			}

			.hero-scroll-hint .mouse {
				width: 24px;
				height: 38px;
				border: 2px solid rgba(255, 255, 255, .4);
				border-radius: 12px;
				position: relative;
			}

			.hero-scroll-hint .mouse::after {
				content: '';
				position: absolute;
				top: 8px;
				left: 50%;
				transform: translateX(-50%);
				width: 4px;
				height: 8px;
				background: #fff;
				border-radius: 2px;
				animation: scrollWheel 1.4s infinite;
			}

			@keyframes fadeInUp {
				from {
					opacity: 0;
					transform: translateY(30px);
				}

				to {
					opacity: 1;
					transform: translateY(0);
				}
			}

			@keyframes bounce {

				0%,
				100% {
					transform: translateX(-50%) translateY(0);
				}

				50% {
					transform: translateX(-50%) translateY(-10px);
				}
			}

			@keyframes scrollWheel {
				0% {
					opacity: 1;
					transform: translateX(-50%) translateY(0);
				}

				100% {
					opacity: 0;
					transform: translateX(-50%) translateY(12px);
				}
			}

			/* ========== 为什么选择正方元 ========== */
			.why-section {
				padding: 50px 0 80px;
				background: transparent;
				position: relative;
				overflow: hidden;
			}

			.why-section::before {
				content: '';
				position: absolute;
				top: -120px;
				right: -180px;
				width: 500px;
				height: 500px;
				border-radius: 50%;
				background: radial-gradient(circle, rgba(0, 102, 255, .06) 0%, transparent 70%);
			}

			.why-section .section-label {
				text-align: center;
				margin-bottom: 14px;
				font-size: .85rem;
				font-weight: 600;
				color: #0066ff;
				letter-spacing: 3px;
				text-transform: uppercase;
			}

			.why-section .section-title {
				text-align: center;
				font-size: 2.4rem;
				font-weight: 700;
				color: #1a2a4a;
				margin-bottom: 14px;
			}

			.why-section .section-desc {
				text-align: center;
				font-size: 1.05rem;
				color: #4a6a8a;
				margin-bottom: 58px;
				max-width: 620px;
				margin-left: auto;
				margin-right: auto;
			}

			.why-title-divider {
				width: 50px;
				height: 3px;
				background: #0066ff;
				margin: 0 auto 58px;
				border-radius: 2px;
			}

			.why-grid {
				display: grid;
				grid-template-columns: repeat(4, 1fr);
				gap: 28px;
				max-width: 1200px;
				margin: 0 auto;
				padding: 0 24px;
			}

			.why-card {
				background: var(--c-white);
				border-radius: 18px;
				padding: 44px 30px 36px;
				text-align: center;
				position: relative;
				overflow: hidden;
				transition: all .45s cubic-bezier(0.4, 0, 0.2, 1);
				border: 1px solid var(--c-border-light);
				cursor: default;
			}

			.why-card::before {
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 4px;
				background: linear-gradient(90deg, #0066ff, #0088ff);
				transform: scaleX(0);
				transform-origin: left;
				transition: transform .45s cubic-bezier(0.4, 0, 0.2, 1);
			}

			.why-card:hover {
				transform: translateY(-10px);
				box-shadow: 0 22px 56px rgba(0, 102, 255, .13);
				border-color: transparent;
			}

			.why-card:hover::before {
				transform: scaleX(1);
			}

			.why-card .why-icon {
				width: 80px;
				height: 80px;
				margin: 0 auto 24px;
				border-radius: 20px;
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
				transition: all .5s cubic-bezier(0.4, 0, 0.2, 1);
			}

			/* 科技感玻璃背景 */
			.why-icon--1,
			.why-icon--2,
			.why-icon--3,
			.why-icon--4 {
				background: linear-gradient(135deg, rgba(0, 102, 255, .1) 0%, rgba(0, 136, 255, .03) 100%);
				border: 1px solid rgba(0, 102, 255, .12);
			}

			/* 外发光晕 */
			.why-card .why-icon::before {
				content: '';
				position: absolute;
				inset: -4px;
				border-radius: 24px;
				background: linear-gradient(135deg, #0066ff, #0088ff, #00c6ff);
				opacity: 0;
				filter: blur(10px);
				transition: opacity .5s;
				z-index: -1;
			}

			/* 旋转虚线环 */
			.why-card .why-icon::after {
				content: '';
				position: absolute;
				inset: 0;
				border-radius: 20px;
				border: 1.5px dashed rgba(0, 102, 255, .2);
				animation: whyIconSpin 14s linear infinite;
				transition: border-color .5s;
			}

			@keyframes whyIconSpin {
				from {
					transform: rotate(0deg);
				}

				to {
					transform: rotate(360deg);
				}
			}

			/* SVG 图标 */
			.why-card .why-icon svg {
				width: 36px;
				height: 36px;
				color: var(--c-blue);
				z-index: 1;
				transition: transform .5s cubic-bezier(0.4, 0, 0.2, 1), color .5s;
				filter: drop-shadow(0 2px 6px rgba(0, 102, 255, .15));
			}

			/* hover 交互 */
			.why-card:hover .why-icon {
				transform: translateY(-6px);
				background: linear-gradient(135deg, rgba(0, 102, 255, .18) 0%, rgba(0, 136, 255, .08) 100%);
			}

			.why-card:hover .why-icon::before {
				opacity: .55;
			}

			.why-card:hover .why-icon::after {
				border-color: rgba(0, 136, 255, .45);
				animation-duration: 6s;
			}

			.why-card:hover .why-icon svg {
				transform: scale(1.18) rotate(-6deg);
				color: var(--c-blue-light);
				filter: drop-shadow(0 4px 12px rgba(0, 136, 255, .3));
			}

			/* 扫描线动画 */
			.why-card .why-icon .why-scan {
				position: absolute;
				left: 10%;
				right: 10%;
				height: 2px;
				background: linear-gradient(90deg, transparent, rgba(0, 136, 255, .5), transparent);
				border-radius: 2px;
				opacity: 0;
				top: 50%;
			}

			.why-card:hover .why-icon .why-scan {
				animation: whyIconScan 1.8s ease-in-out infinite;
			}

			@keyframes whyIconScan {
				0% {
					opacity: 0;
					top: 20%;
				}

				20% {
					opacity: 1;
				}

				80% {
					opacity: 1;
				}

				100% {
					opacity: 0;
					top: 80%;
				}
			}

			.why-card h3 {
				font-size: 1.22rem;
				font-weight: 600;
				color: #1a2a4a;
				margin-bottom: 12px;
			}

			.why-card p {
				font-size: .92rem;
				color: #4a6a8a;
				line-height: 1.75;
				margin: 0;
			}

			/* ========== 关于我们 ========== */
			.about-section {
				padding: 72px 0;
				background: linear-gradient(180deg, var(--c-bg) 0%, var(--c-white) 100%);
				position: relative;
				overflow: hidden;
			}

			.about-section::after {
				content: '';
				position: absolute;
				bottom: -80px;
				left: -100px;
				width: 400px;
				height: 400px;
				border-radius: 50%;
				background: radial-gradient(circle, rgba(0, 102, 255, .04) 0%, transparent 70%);
			}

			.about-wrap {
				max-width: 1200px;
				margin: 0 auto;
				padding: 0 24px;
				display: grid;
				grid-template-columns: 1fr 1fr;
				gap: 70px;
				align-items: center;
			}

			.about-img {
				position: relative;
				border-radius: 20px;
				overflow: hidden;
				box-shadow: 0 20px 60px rgba(0, 102, 255, .15);
				transition: all .5s cubic-bezier(.25, .8, .25, 1.2);
				animation: aboutImgFloat 6s ease-in-out infinite;
			}

			.about-img::before {
				content: '';
				position: absolute;
				inset: -3px;
				border-radius: 22px;
				padding: 3px;
				background: linear-gradient(135deg, rgba(0, 102, 255, .3), rgba(0, 136, 255, .08), rgba(0, 102, 255, .3));
				-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
				-webkit-mask-composite: xor;
				mask-composite: exclude;
				z-index: 2;
				pointer-events: none;
				opacity: .5;
				transition: opacity .5s;
			}

			.about-img::after {
				content: '';
				position: absolute;
				inset: 0;
				background: radial-gradient(ellipse at 30% 30%, rgba(0, 136, 255, .12) 0%, transparent 60%);
				z-index: 1;
				pointer-events: none;
				opacity: 0;
				transition: opacity .5s;
			}

			@keyframes aboutImgFloat {

				0%,
				100% {
					transform: translateY(0);
				}

				50% {
					transform: translateY(-10px);
				}
			}

			.about-img:hover {
				transform: translateY(-8px) scale(1.03);
				box-shadow: 0 28px 72px rgba(0, 102, 255, .22);
			}

			.about-img:hover::before {
				opacity: 1;
			}

			.about-img:hover::after {
				opacity: 1;
			}

			.about-img img {
				width: 100%;
				height: auto;
				display: block;
			}

			.about-img .about-img-badge {
				position: absolute;
				bottom: 28px;
				left: 28px;
				background: rgba(255, 255, 255, .95);
				padding: 16px 24px;
				border-radius: 12px;
				box-shadow: 0 8px 24px rgba(0, 102, 255, .15);
				z-index: 3;
				transition: all .4s cubic-bezier(.25, .8, .25, 1.2);
			}

			.about-img:hover .about-img-badge {
				transform: translateY(-4px) scale(1.05);
				box-shadow: 0 14px 36px rgba(0, 102, 255, .25);
				background: #fff;
			}

			.about-img .about-img-badge .badge-num {
				font-size: 2rem;
				font-weight: 700;
				color: #0066ff;
				line-height: 1;
			}

			.about-img .about-img-badge .badge-label {
				font-size: .85rem;
				color: #4a6a8a;
				margin-top: 4px;
			}

			.about-text .eyebrow {
				display: inline-block;
				font-size: .85rem;
				font-weight: 600;
				color: #0066ff;
				letter-spacing: 3px;
				margin-bottom: 16px;
			}

			.about-text h2 {
				font-size: 2.3rem;
				font-weight: 700;
				color: #1a2a4a;
				line-height: 1.3;
				margin-bottom: 22px;
			}

			.about-text p {
				font-size: 1rem;
				color: #4a6a8a;
				line-height: 1.9;
				margin-bottom: 16px;
			}

			.about-text .about-meta {
				display: flex;
				gap: 14px;
				margin-top: 28px;
				flex-wrap: nowrap;
				justify-content: flex-start;
			}

			.about-text .about-meta .meta-item {
				position: relative;
				display: flex;
				align-items: center;
				gap: 10px;
				padding: 18px 16px;
				background: var(--c-white);
				border-radius: 14px;
				box-shadow: 0 2px 16px rgba(0, 102, 255, .06);
				transition: transform .35s cubic-bezier(.22, .61, .36, 1), box-shadow .35s;
				flex: 1;
				min-width: 0;
				justify-content: center;
				border: 1px solid var(--c-border-light);
				overflow: hidden;
				cursor: default;
			}

			.about-text .about-meta .meta-item::before {
				content: '';
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				height: 3px;
				background: linear-gradient(90deg, var(--c-blue), var(--c-blue-light), var(--c-blue));
				transform: scaleX(0);
				transform-origin: left;
				transition: transform .4s cubic-bezier(.22, .61, .36, 1);
			}

			.about-text .about-meta .meta-item::after {
				content: '';
				position: absolute;
				bottom: -60%;
				right: -30%;
				width: 100px;
				height: 100px;
				border-radius: 50%;
				background: radial-gradient(circle, rgba(0, 136, 255, .08), transparent 70%);
				opacity: 0;
				transition: opacity .4s;
			}

			.about-text .about-meta .meta-item:hover {
				transform: translateY(-6px);
				box-shadow: 0 8px 30px rgba(0, 102, 255, .15);
			}

			.about-text .about-meta .meta-item:hover::before {
				transform: scaleX(1);
			}

			.about-text .about-meta .meta-item:hover::after {
				opacity: 1;
			}

			.about-text .about-meta .meta-icon {
				width: 42px;
				height: 42px;
				border-radius: 12px;
				display: flex;
				align-items: center;
				justify-content: center;
				flex-shrink: 0;
				background: linear-gradient(135deg, rgba(0, 102, 255, .1), rgba(0, 136, 255, .05));
				transition: transform .35s, background .35s;
			}

			.about-text .about-meta .meta-item:hover .meta-icon {
				transform: scale(1.1) rotate(-5deg);
				background: linear-gradient(135deg, rgba(0, 102, 255, .18), rgba(0, 136, 255, .1));
			}

			.about-text .about-meta .meta-icon svg {
				width: 22px;
				height: 22px;
				color: var(--c-blue);
			}

			@keyframes metaIconPulse {

				0%,
				100% {
					transform: scale(1);
				}

				50% {
					transform: scale(1.06);
				}
			}

			.about-text .about-meta .meta-item .meta-icon {
				animation: metaIconPulse 3s ease-in-out infinite;
			}

			.about-text .about-meta .meta-item:nth-child(2) .meta-icon {
				animation-delay: .4s;
			}

			.about-text .about-meta .meta-item:nth-child(3) .meta-icon {
				animation-delay: .8s;
			}

			.about-text .about-meta .meta-info {
				display: flex;
				flex-direction: column;
				line-height: 1.2;
			}

			.about-text .about-meta .meta-num {
				font-size: 1.3rem;
				font-weight: 700;
				color: #1a2a4a;
				white-space: nowrap;
				letter-spacing: -.5px;
			}

			.about-text .about-meta .meta-label {
				font-size: .75rem;
				color: #4a6a8a;
				white-space: nowrap;
				margin-top: 2px;
			}

			/* ========== 数据统计条 ========== */
			.stats-section {
				padding: 60px 0;
				background: linear-gradient(135deg, #001a40, #003380, #004ecc);
				position: relative;
				overflow: hidden;
			}

			.stats-section::before {
				content: '';
				position: absolute;
				top: -40%;
				right: -10%;
				width: 600px;
				height: 600px;
				border-radius: 50%;
				background: radial-gradient(circle, rgba(0, 136, 255, .08) 0%, transparent 70%);
			}

			.stats-section::after {
				content: '';
				position: absolute;
				bottom: -30%;
				left: -5%;
				width: 400px;
				height: 400px;
				border-radius: 50%;
				background: radial-gradient(circle, rgba(59, 130, 246, .06) 0%, transparent 70%);
			}

			.stats-row {
				max-width: 1100px;
				margin: 0 auto;
				padding: 0 24px;
				display: grid;
				grid-template-columns: repeat(4, 1fr);
				gap: 0;
				position: relative;
				z-index: 2;
			}

			.stat-block {
				text-align: center;
				padding: 36px 20px;
				position: relative;
			}

			.stat-block:not(:last-child)::after {
				content: '';
				position: absolute;
				right: 0;
				top: 50%;
				transform: translateY(-50%);
				width: 1px;
				height: 60px;
				background: rgba(255, 255, 255, .12);
			}

			.stat-block .stat-num {
				font-size: 3.2rem;
				font-weight: 700;
				color: #0088ff;
				line-height: 1.1;
				margin-bottom: 8px;
			}

			.stat-block .stat-unit {
				font-size: 1.1rem;
				font-weight: 500;
				color: #0088ff;
				margin-left: 2px;
			}

			.stat-block .stat-label {
				font-size: .95rem;
				color: rgba(255, 255, 255, .65);
				letter-spacing: 1px;
				margin-top: 6px;
			}

			.stat-block:hover .stat-num {
				animation: pulse .5s ease;
			}

			@keyframes pulse {

				0%,
				100% {
					transform: scale(1);
				}

				50% {
					transform: scale(1.08);
				}
			}

			/* ========== 业务板块 ========== */
			.biz-section {
				
				position: relative;
			}

			.biz-section .section-label {
				text-align: center;
				margin-bottom: 14px;
				font-size: .85rem;
				font-weight: 600;
				color: #0066ff;
				letter-spacing: 3px;
			}

			.biz-section .section-title {
				text-align: center;
				font-size: 2.4rem;
				font-weight: 700;
				color: #1a2a4a;
				margin-bottom: 14px;
			}

			.biz-section .section-desc {
				text-align: center;
				font-size: 1.05rem;
				color: #4a6a8a;
				margin-bottom: 60px;
			}

			.biz-grid {
				max-width: 1200px;
				margin: 0 auto;
				padding: 0 24px;
				display: grid;
				grid-template-columns: repeat(4, 1fr);
				gap: 28px;
			}

			.biz-card {
				background: var(--c-white);
				border-radius: 20px;
				padding: 0 0 36px;
				overflow: hidden;
				transition: all .45s cubic-bezier(0.4, 0, 0.2, 1);
				box-shadow: 0 4px 20px rgba(0, 102, 255, .07);
				cursor: default;
				border: 1px solid rgba(0, 102, 255, .08);
			}

			.biz-card:hover {
				transform: translateY(-12px);
				box-shadow: 0 20px 50px rgba(0, 102, 255, .14);
			}

			.biz-card .biz-img-wrap {
				height: 180px;
				position: relative;
				overflow: hidden;
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.biz-card .biz-img-wrap svg {
				width: 70%;
				height: 70%;
				opacity: .9;
				transition: transform .5s;
			}

			.biz-card .biz-img-wrap img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				transition: transform .5s cubic-bezier(0.4, 0, 0.2, 1);
			}

			.biz-card:hover .biz-img-wrap svg {
				transform: scale(1.1);
			}

			.biz-card:hover .biz-img-wrap img {
				transform: scale(1.12);
			}

			.biz-img--ad {
				background: linear-gradient(135deg, #e8f0fe, #d2e3fc);
			}

			.biz-img--tax {
				background: linear-gradient(135deg, #e6f7f0, #c8f0dd);
			}

			.biz-img--health {
				background: linear-gradient(135deg, #fef3e2, #fde7c2);
			}

			.biz-img--hvac {
				background: linear-gradient(135deg, #f0ebf8, #ddd0f0);
			}

			.biz-card .biz-body {
				padding: 28px 24px 0;
			}

			.biz-card .biz-body h3 {
				font-size: 1.2rem;
				font-weight: 600;
				color: #1a2a4a;
				margin-bottom: 10px;
			}

			.biz-card .biz-body p {
				font-size: .9rem;
				color: #4a6a8a;
				line-height: 1.7;
				margin: 0;
			}

			.biz-card .biz-body .biz-tags {
				display: flex;
				flex-wrap: wrap;
				gap: 8px;
				margin-top: 18px;
			}

			.biz-card .biz-body .biz-tag {
				padding: 5px 14px;
				background: var(--c-blue-bg);
				border-radius: 20px;
				font-size: .78rem;
				color: #0066ff;
				font-weight: 500;
				transition: all .3s;
			}

			.biz-card:hover .biz-body .biz-tag {
				background: #0066ff;
				color: #fff;
			}

			/* ========== 办公地点 ========== */
			.contact-section {
				padding: 50px 0;
				background: var(--c-bg);
				position: relative;
			}

			.contact-section .section-label {
				text-align: center;
				margin-bottom: 14px;
				font-size: .85rem;
				font-weight: 600;
				color: #0066ff;
				letter-spacing: 3px;
			}

			.contact-section .section-title {
				text-align: center;
				font-size: 2.4rem;
				font-weight: 700;
				color: #1a2a4a;
				margin-bottom: 14px;
			}

			.contact-section .section-desc {
				text-align: center;
				font-size: 1.05rem;
				color: #4a6a8a;
				margin-bottom: 60px;
			}

			.company-grid {
				max-width: 1200px;
				margin: 0 auto;
				padding: 0 24px;
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				gap: 28px;
			}

			.company-card {
				background: var(--c-white);
				border-radius: 16px;
				padding: 32px;
				display: flex;
				gap: 20px;
				transition: all .4s;
				box-shadow: 0 2px 16px rgba(0, 102, 255, .05);
				border: 1px solid var(--c-border-light);
				position: relative;
				overflow: hidden;
			}

			.company-card::after {
				content: '';
				position: absolute;
				top: 0;
				right: 0;
				width: 120px;
				height: 120px;
				background: radial-gradient(circle, rgba(0, 102, 255, .06) 0%, transparent 70%);
				border-radius: 0 0 0 120px;
			}

			.company-card:hover {
				transform: translateY(-6px);
				box-shadow: 0 16px 40px rgba(0, 102, 255, .1);
				border-color: transparent;
			}

			.company-card .co-qr {
				flex-shrink: 0;
				text-align: center;
			}

			.company-card .co-qr img {
				width: 88px;
				height: 88px;
				border-radius: 8px;
				border: 1px solid var(--c-border-light);
				object-fit: contain;
			}

			.company-card .co-qr .qr-label {
				font-size: .72rem;
				color: var(--c-text3);
				margin-top: 6px;
			}

			.company-card .co-info {
				flex: 1;
				position: relative;
				z-index: 1;
			}

			.company-card .co-info h3 {
				font-size: 1.12rem;
				font-weight: 600;
				color: #1a2a4a;
				margin-bottom: 10px;
				padding-bottom: 8px;
				border-bottom: 2px solid rgba(0, 102, 255, .08);
			}

			.company-card:hover .co-info h3 {
				border-bottom-color: #0088ff;
			}

			.company-card .co-info .co-line {
				font-size: .88rem;
				color: #4a6a8a;
				margin-bottom: 5px;
				display: flex;
				align-items: center;
				gap: 6px;
			}

			.company-card .co-info .co-line .co-icon {
				color: #0066ff;
				flex-shrink: 0;
			}

			/* ========== 通用动画类 ========== */
			.fade-in {
				opacity: 1;
				transform: none;
				transition: opacity .85s cubic-bezier(0.22, 0.61, 0.36, 1), transform .85s cubic-bezier(0.22, 0.61, 0.36, 1);
			}

			.fade-in.visible {
				opacity: 1;
				transform: translateY(0);
			}

			.fade-in-delay-1 {
				transition-delay: .15s;
			}

			.fade-in-delay-2 {
				transition-delay: .3s;
			}

			.fade-in-delay-3 {
				transition-delay: .45s;
			}

			/* ========== 响应式 ========== */
			

			

			

			/* ========== 办公环境轮播区 ========== */
			.office-section {
				padding: 72px 0;
				background: linear-gradient(180deg, #f5f7fa 0%, #eef1f6 100%);
				position: relative;
			}

			.office-section .section-header {
				text-align: center;
				margin-bottom: 60px;
				padding: 0 20px;
			}

			.office-section .section-header .badge {
				display: inline-block;
				padding: 6px 20px;
				background: rgba(45, 74, 214, 0.1);
				color: var(--primary-light);
				font-size: 13px;
				font-weight: 600;
				border-radius: 20px;
				margin-bottom: 16px;
				letter-spacing: 2px;
			}

			.office-section .section-header h2 {
				font-size: 42px;
				font-weight: 800;
				color: var(--text-dark);
				margin-bottom: 16px;
			}

			.office-section .section-header p {
				font-size: 17px;
				color: var(--text-muted);
				max-width: 600px;
				margin: 0 auto;
			}

			.office-section .section-header .divider {
				width: 60px;
				height: 4px;
				background: linear-gradient(90deg, var(--primary), var(--accent));
				margin: 20px auto 0;
				border-radius: 2px;
			}

			/* 轮播主体 */
			.carousel-wrapper {
				max-width: 1219px;
				margin: 0 auto;
				padding: 0 20px;
			}

			.carousel-container {
				position: relative;
				border-radius: 24px;
				overflow: hidden;
				box-shadow: var(--shadow-strong);
				background: #fff;
			}

			.carousel-track {
				position: relative;
				
				height: 660px;
				overflow: hidden;
			}

			.carousel-slide {
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				opacity: 0;
				transition: opacity 0.8s ease, transform 1s ease;
				transform: scale(1.05);
				pointer-events: none;
			}

			.carousel-slide.active {
				opacity: 1;
				transform: scale(1);
				pointer-events: auto;
				z-index: 2;
			}

			.carousel-slide .slide-bg {
				position: absolute;
				inset: 0;
				background-size: cover;
				background-position: center;
				animation: kenburns 8s ease-out forwards;
			}

			@keyframes kenburns {
				from {
					transform: scale(1.15);
				}

				to {
					transform: scale(1);
				}
			}

			.carousel-slide .slide-overlay {
				position: absolute;
				inset: 0;
				background: linear-gradient(180deg,
						rgba(26, 42, 108, 0.1) 0%,
						rgba(26, 42, 108, 0.3) 50%,
						rgba(26, 42, 108, 0.85) 100%);
			}

			.slide-content {
				position: absolute;
				bottom: 0;
				left: 0;
				right: 0;
				padding: 50px 60px;
				z-index: 3;
				color: #fff;
			}

			.slide-content .company-tag {
				display: inline-block;
				padding: 5px 16px;
				background: rgba(240, 193, 75, 0.9);
				color: #1a2a6c;
				font-size: 13px;
				font-weight: 700;
				border-radius: 12px;
				margin-bottom: 16px;
				letter-spacing: 1px;
			}

			.slide-content h3 {
				font-size: 36px;
				font-weight: 800;
				margin-bottom: 14px;
				text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
				transform: translateY(20px);
				opacity: 0;
				transition: all 0.6s ease 0.2s;
			}

			.slide-content p {
				font-size: 16px;
				line-height: 1.9;
				max-width: 600px;
				color: rgba(255, 255, 255, 0.9);
				text-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
				transform: translateY(20px);
				opacity: 0;
				transition: all 0.6s ease 0.4s;
			}

			.slide-content .location {
				display: flex;
				align-items: center;
				gap: 8px;
				margin-top: 16px;
				font-size: 14px;
				color: rgba(255, 255, 255, 0.75);
				transform: translateY(20px);
				opacity: 0;
				transition: all 0.6s ease 0.6s;
			}

			.carousel-slide.active .slide-content h3,
			.carousel-slide.active .slide-content p,
			.carousel-slide.active .slide-content .location {
				transform: translateY(0);
				opacity: 1;
			}

			.slide-content .location svg {
				width: 16px;
				height: 16px;
				fill: var(--accent);
			}

			/* 导航箭头 */
			.carousel-nav {
				position: absolute;
				top: 50%;
				transform: translateY(-50%);
				width: 52px;
				height: 52px;
				border-radius: 50%;
				background: rgba(255, 255, 255, 0.2);
				backdrop-filter: blur(10px);
				border: 2px solid rgba(255, 255, 255, 0.3);
				display: flex;
				align-items: center;
				justify-content: center;
				cursor: pointer;
				z-index: 10;
				transition: var(--transition);
				color: #fff;
			}

			.carousel-nav:hover {
				background: rgba(255, 255, 255, 0.35);
				border-color: rgba(255, 255, 255, 0.6);
				transform: translateY(-50%) scale(1.1);
			}

			.carousel-nav svg {
				width: 24px;
				height: 24px;
				fill: #fff;
			}

			.carousel-nav.prev {
				left: 24px;
			}

			.carousel-nav.next {
				right: 24px;
			}

			/* 指示点 */
			.carousel-dots {
				display: flex;
				justify-content: center;
				gap: 10px;
				padding: 24px 0 10px;
			}

			.carousel-dot {
				width: 10px;
				height: 10px;
				border-radius: 50%;
				background: #ccc;
				cursor: pointer;
				transition: var(--transition);
				border: none;
			}

			.carousel-dot.active {
				width: 36px;
				border-radius: 5px;
				background: linear-gradient(90deg, var(--primary), var(--primary-light));
			}

			/* 缩略图导航 */
			.carousel-thumbnails {
				display: flex;
				padding: 16px 40px 40px;
				overflow-x: auto;
				justify-content: center;
				flex-wrap: wrap;
			}

			.thumbnail {
				flex-shrink: 0;
				width: 132px;
				height: 80px;
				border-radius: 10px;
				overflow: hidden;
				cursor: pointer;
				border: 3px solid transparent;
				transition: var(--transition);
				position: relative;
				opacity: 0.55;
			}

			.thumbnail:hover {
				opacity: 0.85;
				transform: translateY(-3px);
			}

			.thumbnail.active {
				border-color: var(--primary-light);
				opacity: 1;
				box-shadow: 0 4px 15px rgba(45, 74, 214, 0.3);
			}

			.thumbnail img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

			.thumbnail .thumb-label {
				position: absolute;
				bottom: 0;
				left: 0;
				right: 0;
				padding: 4px 8px;
				background: linear-gradient(180deg, transparent, rgba(0, 0, 0, 0.7));
				color: #fff;
				font-size: 11px;
				font-weight: 500;
				text-align: center;
			}

			/* 自动播放进度条 */
			.progress-bar {
				position: absolute;
				bottom: 0;
				left: 0;
				height: 3px;
				background: linear-gradient(90deg, var(--accent), #fff);
				z-index: 5;
				width: 0;
				transition: none;
			}

			.progress-bar.running {
				animation: progressFill 5s linear forwards;
			}

			@keyframes progressFill {
				from {
					width: 0;
				}

				to {
					width: 100%;
				}
			}

			/* ===== 科技地球动画（透明背景，CSS绘制） ===== */
			.tech-earth-bg {
				position: absolute;
				inset: 0;
				z-index: 3;
				overflow: hidden;
				background: transparent;
				pointer-events: none;
			}

			.tech-earth-bg .earth-layer {
				position: absolute;
				top: 50%;
				left: 50%;
				transform: translate(-50%, -50%);
				perspective: 800px;
				width: 260px;
				height: 260px;
			}

			.tech-earth-bg .ring {
				position: absolute;
				border-radius: 50%;
			}

			.tech-earth-bg .ring-1 {
				inset: -40px;
				border: 3px solid rgba(0, 136, 255, .25);
				border-top-color: rgba(0, 102, 255, .4);
				border-bottom-color: rgba(0, 78, 204, .2);
				animation: teRing1 12s linear infinite;
			}

			.tech-earth-bg .ring-2 {
				inset: -55px;
				border: 2px solid rgba(0, 120, 220, .2);
				border-left-color: rgba(0, 136, 255, .35);
				animation: teRing2 18s linear infinite;
			}

			.tech-earth-bg .ring-3 {
				inset: -22px;
				border: 2px dashed rgba(0, 136, 255, .18);
				animation: teRing3 10s linear infinite;
			}

			.tech-earth-bg .globe {
				width: 100%;
				height: 100%;
				border-radius: 50%;
				position: relative;
				transform-style: preserve-3d;
				animation: teSpin 8s linear infinite;
			}

			.tech-earth-bg .meridian {
				position: absolute;
				inset: 0;
				border-radius: 50%;
				border: 1.5px solid rgba(0, 136, 255, .15);
			}

			.tech-earth-bg .latitude {
				position: absolute;
				border-radius: 50%;
				border: 1px solid rgba(0, 102, 255, .1);
			}

			.tech-earth-bg .core {
				position: absolute;
				inset: 0;
				border-radius: 50%;
				background: radial-gradient(circle at 35% 30%, rgba(0, 136, 255, .1), transparent 70%);
				box-shadow: inset -15px -15px 30px rgba(0, 102, 255, .06), 0 0 40px rgba(0, 136, 255, .08);
			}

			@keyframes teSpin {
				from {
					transform: rotateY(0deg);
				}

				to {
					transform: rotateY(360deg);
				}
			}

			@keyframes teRing1 {
				from {
					transform: rotateX(70deg) rotateZ(0deg);
				}

				to {
					transform: rotateX(70deg) rotateZ(360deg);
				}
			}

			@keyframes teRing2 {
				from {
					transform: rotateX(60deg) rotateY(30deg) rotateZ(0deg);
				}

				to {
					transform: rotateX(60deg) rotateY(30deg) rotateZ(-360deg);
				}
			}

			@keyframes teRing3 {
				from {
					transform: rotateY(75deg) rotateZ(0deg);
				}

				to {
					transform: rotateY(75deg) rotateZ(360deg);
				}
			}