/* ========== 基础重置与字体 ========== */
			*,
			::before,
			::after {
				box-sizing: border-box;
				border-width: 0;
				border-style: solid;
				border-color: #e5e7eb
			}

			html {
				line-height: 1.5;
				-webkit-text-size-adjust: 100%;
				-moz-tab-size: 4;
				tab-size: 4
			}

			body {
				margin: 0;
				line-height: inherit;
				font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif
			}

			a {
				color: inherit;
				text-decoration: inherit
			}

			b,
			strong {
				font-weight: bolder
			}

			button,
			input,
			select,
			textarea {
				font-family: inherit;
				font-size: 100%;
				font-weight: inherit;
				line-height: inherit;
				color: inherit;
				margin: 0;
				padding: 0
			}

			button {
				text-transform: none;
				cursor: pointer
			}

			img,
			svg,
			video,
			canvas,
			audio,
			iframe,
			embed,
			object {
				display: block;
				vertical-align: middle
			}

			/* ========== 工具类 (按需提取Tailwind) ========== */
			.flex {
				display: flex
			}

			.inline-flex {
				display: inline-flex
			}

			.grid {
				display: grid
			}

			.hidden {
				display: none
			}

			.items-center {
				align-items: center
			}

			.justify-center {
				justify-content: center
			}

			.flex-col {
				flex-direction: column
			}

			.flex-1 {
				flex: 1 1 0%
			}

			.shrink-0 {
				flex-shrink: 0
			}

			.gap-2 {
				gap: 0.5rem
			}

			.gap-4 {
				gap: 1rem
			}

			.gap-8 {
				gap: 2rem
			}

			.text-center {
				text-align: center
			}

			.relative {
				position: relative
			}

			.absolute {
				position: absolute
			}

			.z-10 {
				z-index: 10
			}

			.w-16 {
				width: 4rem
			}

			.w-20 {
				width: 5rem
			}

			.h-16 {
				height: 4rem
			}

			.h-20 {
				height: 5rem
			}

			.w-full {
				width: 100%
			}

			.w-px {
				width: 1px
			}

			.h-px {
				height: 1px
			}

			.max-w-6xl {
				max-width: var(--content-width)
			}

			.max-w-xs {
				max-width: 20rem
			}

			.mx-auto {
				margin-left: auto;
				margin-right: auto
			}

			.mt-4 {
				margin-top: 1rem
			}

			.mt-6 {
				margin-top: 1.5rem
			}

			.mt-12 {
				margin-top: 3rem
			}

			.mb-3 {
				margin-bottom: 0.75rem
			}

			.mb-4 {
				margin-bottom: 1rem
			}

			.mb-6 {
				margin-bottom: 1.5rem
			}

			.my-2 {
				margin-top: 0.5rem;
				margin-bottom: 0.5rem
			}

			.p-4 {
				padding: 1rem
			}

			.p-8 {
				padding: 2rem
			}

			.px-2 {
				padding-left: 0.5rem;
				padding-right: 0.5rem
			}

			.py-1 {
				padding-top: 0.25rem;
				padding-bottom: 0.25rem
			}

			.text-white {
				color: #fff
			}

			.text-slate-300 {
				color: #cbd5e1
			}

			.text-slate-400 {
				color: #94a3b8
			}

			.text-slate-500 {
				color: #64748b
			}

			.text-cyan-400 {
				color: #22D3EE
			}

			.text-red-400 {
				color: #f87171
			}

			.text-xs {
				font-size: 0.75rem;
				line-height: 1rem
			}

			.text-sm {
				font-size: 0.875rem;
				line-height: 1.25rem
			}

			.text-lg {
				font-size: 1.125rem;
				line-height: 1.75rem
			}

			.text-xl {
				font-size: 1.25rem;
				line-height: 1.75rem
			}

			.text-2xl {
				font-size: 1.5rem;
				line-height: 2rem
			}

			.font-bold {
				font-weight: 700
			}

			.font-semibold {
				font-weight: 600
			}

			.font-mono {
				font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace
			}

			.tracking-wide {
				letter-spacing: 0.025em
			}

			.leading-relaxed {
				line-height: 1.625
			}

			.bg-white\/\[0\.02\] {
				background-color: rgba(255, 255, 255, 0.02)
			}

			.bg-cyan-500\/10 {
				background-color: rgba(34, 211, 238, 0.1)
			}

			.bg-red-500\/10 {
				background-color: rgba(239, 68, 68, 0.1)
			}

			.bg-cyan-500\/5 {
				background-color: rgba(34, 211, 238, 0.05)
			}

			.bg-purple-500\/5 {
				background-color: rgba(139, 92, 246, 0.05)
			}

			.bg-white\/10 {
				background-color: rgba(255, 255, 255, 0.1)
			}

			.border {
				border-width: 1px
			}

			.border-white\/5 {
				border-color: rgba(255, 255, 255, 0.05)
			}

			.border-white\/10 {
				border-color: rgba(255, 255, 255, 0.1)
			}

			.border-cyan-500\/20 {
				border-color: rgba(34, 211, 238, 0.2)
			}

			.rounded-2xl {
				border-radius: 1rem
			}

			.rounded-3xl {
				border-radius: 1.5rem
			}

			.rounded-full {
				border-radius: 9999px
			}

			.rounded {
				border-radius: 0.25rem
			}

			.blur-3xl {
				filter: blur(64px)
			}

			.backdrop-blur-sm {
				backdrop-filter: blur(4px);
				-webkit-backdrop-filter: blur(4px)
			}

			.transition-all {
				transition-property: all;
				transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
				transition-duration: 150ms
			}

			.duration-300 {
				transition-duration: 300ms
			}

			.group:hover .group-hover\:opacity-100 {
				opacity: 1
			}

			.group:hover .group-hover\:border-red-500\/20 {
				border-color: rgba(239, 68, 68, 0.2)
			}

			.group:hover .group-hover\:border-cyan-400\/50 {
				border-color: rgba(34, 211, 238, 0.5)
			}

			.pointer-events-none {
				pointer-events: none
			}

			.overflow-hidden {
				overflow: hidden
			}

			.min-h-screen {
				min-height: 100vh
			}

			.opacity-70 {
				opacity: 0.7
			}

			@media (min-width: 1024px) {
				.lg\:flex {
					display: flex
				}

				.lg\:hidden {
					display: none
				}

				.lg\:flex-row {
					flex-direction: row
				}

				.lg\:w-1\/2 {
					width: 50%
				}

				.lg\:gap-12 {
					gap: 3rem
				}
			}

			@media (min-width: 768px) {
				.md\:text-2xl {
					font-size: 1.5rem;
					line-height: 2rem
				}

				.md\:p-12 {
					padding: 3rem
				}
			}

			/* ========== 自定义样式 ========== */
			body {
				background-color: #020617;
				overflow-x: hidden;
			}

			.gradient-bg {
				background: radial-gradient(circle at 20% 30%, rgba(34, 211, 238, 0.06) 0%, transparent 50%),
					radial-gradient(circle at 80% 70%, rgba(167, 139, 250, 0.04) 0%, transparent 50%);
			}

			.ripple-container {
				position: relative;
				overflow: hidden;
			}

			.ripple-effect {
				position: absolute;
				border-radius: 50%;
				background: rgba(34, 211, 238, 0.15);
				transform: scale(0);
				animation: none;
				pointer-events: none;
				opacity: 0;
				transition: opacity 0.3s;
			}

			.ripple-container:hover .ripple-effect {
				animation: ripple 1.5s ease-out infinite;
				opacity: 1;
			}

			@keyframes ripple {
				0% {
					transform: scale(0);
					opacity: 0.6;
				}

				100% {
					transform: scale(4);
					opacity: 0;
				}
			}

			.left-icon {
				color: #94A3B8;
				transition: all 0.3s ease;
			}

			.right-icon {
				color: #22D3EE;
				filter: drop-shadow(0 0 8px rgba(34, 211, 238, 0.5));
				transition: all 0.3s ease;
			}

			.hover-glow:hover .right-icon {
				filter: drop-shadow(0 0 18px rgba(34, 211, 238, 0.8));
			}

			.quote-line {
				background: linear-gradient(90deg, transparent, rgba(34, 211, 238, 0.4), transparent);
				height: 1px;
				width: 60%;
				margin: 0 auto;
			}