@layer utilities {
	html {
		scroll-behavior: smooth;
		scroll-padding-top: 100px; /* Header height */
	}
	p {
		hyphens: auto;
	}
	.content-auto {
		content-visibility: auto;
	}
	.text-shadow {
		text-shadow: 0 2px 4px rgba(0,0,0,0.1);
	}
	.hover-lift {
		transition: transform 0.3s ease, box-shadow 0.3s ease;
	}
	.hover-lift:hover {
		transform: translateY(-5px);
		box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
	}
	.gradient-overlay {
		background: linear-gradient(to right, rgba(22, 93, 255, 0.9), rgba(22, 93, 255, 0.7));
	}
	.animate-float {
		animation: float 6s ease-in-out infinite;
	}
	@keyframes float {
		0% { transform: translateY(0px); }
		50% { transform: translateY(-20px); }
		100% { transform: translateY(0px); }
	}
	.animate-text-reveal {
		position: relative;
		overflow: hidden;
	}
	.animate-text-reveal::after {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: linear-gradient(90deg, transparent, white, transparent);
		transform: translateX(-100%);
		animation: text-reveal 2s infinite;
	}
	@keyframes text-reveal {
		100% { transform: translateX(100%); }
	}
	.card-pulse {
		animation: pulse 3s infinite;
	}
	@keyframes pulse {
		0%, 100% { opacity: 1; }
		50% { opacity: 0.8; }
	}
	.text-balance {
		text-wrap: balance;
	}

	/* 全宽子导航样式 */
	.full-width-subnav-inner {
		background-color: white;
		box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
		padding: 2rem 0;
	}

	.full-width-subnav {
		display: none;
		opacity: 0;
		visibility: hidden;
		position: absolute;
		transition: opacity 0.5s ease, visibility 0.5s ease;
		top: 100%;
		left: 0;
		width: 100vw; /* 使用viewport宽度 */
		z-index: 100;
		padding-top: 2%;
		margin-top: -2%;
	}

	.nav-item:hover .full-width-subnav {
		display: block;
		opacity: 1;
  		visibility: visible;
	}

	.subnav-category-title {
		font-weight: bold;
		margin-bottom: 1rem;
		color: #3e53a1;
		text-transform: uppercase;
		font-size: 0.9rem;
	}

	.subnav-item {
		padding: 0.5rem 0;
		transition: all 0.2s ease;
	}

	.subnav-item:hover {
		color: #3e53a1;
		transform: translateX(5px);
	}

	.subnav-grid {
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(200px, 0.25fr));
		gap: 2rem;
	}
	
	.service-card bg-white rounded-xl shadow-lg p-8 hover:shadow-2xl hover:scale-105 transition-all duration-300-shadow {
		box-shadow: 0 10px 30px rgba(22, 93, 255, 0.05);
	}
	.section-padding {
		padding-top: clamp(4rem, 10vh, 8rem);
		padding-bottom: clamp(4rem, 10vh, 8rem);
	}
	.glass-effect {
		backdrop-filter: blur(10px);
		background-color: rgba(255, 255, 255, 0.1);
	}
	.node-pulse {
		animation: pulse 2s infinite;
	}
	@keyframes pulse {
		0% {
			transform: scale(1);
			opacity: 1;
		}
		50% {
			transform: scale(1.2);
			opacity: 0.7;
		}
		100% {
			transform: scale(1);
			opacity: 1;
		}
	}
	.timeline-line {
		height: 100%;
		width: 2px;
		background: linear-gradient(to bottom, #165DFF, #7C3AED);
	}
	.rotate-hover {
		transition: transform 0.5s ease;
	}
	.rotate-hover:hover {
		transform: rotate(360deg);
	}
	.scrollbar-hide::-webkit-scrollbar {
		display: none;
	}
	.scrollbar-hide {
		-ms-overflow-style: none;
		scrollbar-width: none;
	}
	.job-card-hover {
		transition: all 0.3s ease;
	}
	.job-card-hover:hover {
		transform: translateY(-5px);
		box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
	}
	.filter-active {
		background-color: #165DFF;
		color: white;
	}
	.filter-badge {
		transition: all 0.2s ease;
	}
	.filter-badge:hover {
		transform: scale(1.05);
	}
	.disclaimer-content {
		scrollbar-width: thin;
		scrollbar-color: rgba(22, 93, 255, 0.5) rgba(22, 93, 255, 0.1);
	}
	.disclaimer-content::-webkit-scrollbar {
		width: 6px;
	}
	.disclaimer-content::-webkit-scrollbar-track {
		background: rgba(22, 93, 255, 0.1);
		border-radius: 10px;
	}
	.disclaimer-content::-webkit-scrollbar-thumb {
		background-color: rgba(22, 93, 255, 0.5);
		border-radius: 10px;
	}
	/* 滚动按钮样式 */
	.scroll-button {
		top: 50%;
		position: absolute;
		transform: translateY(-50%);
		width: 40px;
		height: 40px;
		background-color: rgba(255, 255, 255, 0.8);
		border-radius: 50%;
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 10;
		transition: all 0.3s ease;
		cursor: pointer;
	}
	.scroll-button:hover {
		background-color: rgba(22, 93, 255, 0.8);
		color: white;
	}
	.scroll-left {
		left: 10px;
	}
	.scroll-right {
		right: 10px;
	}
	.news-card {
		background-color: white;
		border-radius: 10px;
		box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
		overflow: hidden;
		transition: all 0.3s ease;
	}
	.news-card:hover {
		box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.06);
		transform: translateY(-3px);
	}
	.news-image {
		height: 200px;
		overflow: hidden;
	}
	.news-image img {
		width: 100%;
		height: 100%;
		object-fit: cover;
		transition: transform 0.5s ease;
	}
	.news-card:hover .news-image img {
		transform: scale(1.05);
	}
	.news-category {
		color: #3e53a1;
		font-size: 0.9rem;
		font-weight: bold;
		text-transform: uppercase;
		margin-bottom: 5px;
	}
	.news-title {
		font-size: 1.5rem;
		font-weight: bold;
		margin-bottom: 5px;
		line-height: 1.3;
	}
	.news-meta {
		color: #6b7280;
		font-size: 0.9rem;
		margin-bottom: 10px;
	}
	.news-excerpt {
		color: #6b7280;
		line-height: 1.6;
		margin-bottom: 15px;
	}
	.pagination {
		display: flex;
		justify-content: center;
		align-items: center;
		margin-top: 40px;
	}
	.pagination button {
		background-color: white;
		border: 1px solid #e5e7eb;
		color: #333;
		padding: 8px 16px;
		border-radius: 5px;
		margin: 0 5px;
		transition: all 0.3s ease;
	}
	.pagination button:hover {
		background-color: #3e53a1;
		color: white;
		border-color: #3e53a1;
	}
	.active-page {
		background-color: #3e53a1;
		color: white;
		border-color: #3e53a1;
	}
	.article-content h2 {
		font-size: 1.8rem;
		font-weight: bold;
		margin-top: 2rem;
		margin-bottom: 1rem;
		color: #1E293B;
	}
	.article-content p {
		line-height: 1.8;
		margin-bottom: 1.5rem;
		color: #4B5563;
	}
	.article-content ul {
		list-style-type: disc;
		padding-left: 2rem;
		margin-bottom: 1.5rem;
		line-height: 1.8;
		color: #4B5563;
	}
	.article-content blockquote {
		border-left: 4px solid #3e53a1;
		padding-left: 1.5rem;
		margin: 2rem 0;
		font-style: italic;
		color: #6B7280;
	}
	.share-button {
		width: 40px;
		height: 40px;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		color: white;
		transition: all 0.3s ease;
	}
	.share-button:hover {
		transform: scale(1.1);
	}
	.comment-card {
		background-color: white;
		border-radius: 10px;
		padding: 20px;
		margin-bottom: 20px;
		box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
	}
	.comment-avatar {
		width: 50px;
		height: 50px;
		border-radius: 50%;
		overflow: hidden;
		margin-right: 15px;
	}
	.comment-avatar img {
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}