body {
	font-family: "DM Sans", sans-serif;
	height: auto !important;
	font-weight: 300;
	color: #112030;
	letter-spacing: 0.5px;
	font-size: 14px;
}
a {
	text-decoration: none ;
}
a:focus, .btn:focus {
	outline: none;
	outline-offset: 0px;
}
a:hover, a:focus {
	text-decoration: none;
}
ul {
	margin: 0px;
	padding: 0px;
}
li {
	list-style: none;
}
header {
	transition: all 0.3s ease-in-out;
	position: relative;
}

header nav {
	position: relative;
	/* font-family: "DM Mono", monospace; */
	font-weight: 100;
}
section {
	position: relative;
	z-index: 5;
	overflow: hidden;
}
h1, 
h2,
h3 {
	font-family: "PT Serif", serif;
}
p {
	font-weight: normal;
}

/* AI Gradient Text */
.ai-gradient-text {
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	background-size: 200% 200%;
	animation: buttonGradientShift 3s ease infinite;
}

@tailwind base;
@tailwind components;
@tailwind utilities;



.sticky-header header {
	padding: 20px 70px;
}
.sticky-header header .head-outer, .sticky-header header .head-outer {
	border-radius: 50px;
	background-color: rgba(255, 255, 255, 0.4); /* semi-transparent white */
	backdrop-filter: blur(12px); /* background blur */
	-webkit-backdrop-filter: blur(12px); /* Safari support */
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}
.sticky-header header .head-outer .blur-bg-submenu  {
	background-color: rgba(255, 255, 255, 0.6); /* semi-transparent white */
	backdrop-filter: blur(12px); /* background blur */
	-webkit-backdrop-filter: blur(12px); /* Safari support */
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}
.sticky-header header {
	
}
.glass-1, .glass-2 {
	display: none;
}
.sticky-header .glass-1, .sticky-header .glass-2{
	display: block;
}

/* AI Button Styles */
.ai-button {
	position: relative;
	cursor: pointer;
	border: none;
	outline: none;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	transform-style: preserve-3d;
	perspective: 1000px;
}

.ai-button-bg {
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);
	background-size: 200% 200%;
	animation: buttonGradientShift 3s ease infinite;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	border-radius: 0.5rem;
}

.ai-button:hover .ai-button-bg {
	background-size: 250% 250%;
	animation-duration: 1.5s;
	filter: brightness(1.1);
}

.ai-button-shine {
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
	background-size: 200% 100%;
	transform: translateX(-100%) skewX(-15deg);
	transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}

.ai-button:hover .ai-button-shine {
	transform: translateX(200%) skewX(-15deg);
	animation: buttonShimmer 1.5s ease-in-out infinite;
}

.ai-button-glow {
	background: radial-gradient(circle at center, rgba(59, 130, 246, 0.4), transparent 70%);
	filter: blur(20px);
	transform: scale(0.8);
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.ai-button:hover .ai-button-glow {
	transform: scale(1.2);
	animation: buttonPulse 2s ease-in-out infinite;
}

.ai-button-text {
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
	transition: all 0.3s ease;
}

.ai-button:hover {
	transform: translateY(-2px) scale(1.02);
	box-shadow: 0 10px 30px rgba(59, 130, 246, 0.4), 
	            0 0 20px rgba(139, 92, 246, 0.3),
	            0 0 40px rgba(6, 182, 212, 0.2);
}

.ai-button:active {
	transform: translateY(0px) scale(0.98);
}

.ai-button:focus {
	outline: none;
	box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.5);
}

/* Button Animations */
@keyframes buttonGradientShift {
	0%, 100% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
}

@keyframes buttonShimmer {
	0% {
		transform: translateX(-100%) skewX(-15deg);
	}
	100% {
		transform: translateX(200%) skewX(-15deg);
	}
}

@keyframes buttonPulse {
	0%, 100% {
		opacity: 0.4;
		transform: scale(1.2);
	}
	50% {
		opacity: 0.7;
		transform: scale(1.3);
	}
}

/* AI Button Outline Styles */
.ai-button-outline {
	position: relative;
	cursor: pointer;
	border: none;
	outline: none;
	background: transparent;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	transform-style: preserve-3d;
	perspective: 1000px;
}

.ai-button-outline-bg {
	background: transparent;
	border-radius: 0.5rem;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.ai-button-outline:hover .ai-button-outline-bg {
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(139, 92, 246, 0.1) 50%, rgba(6, 182, 212, 0.1) 100%);
}

.ai-button-outline-border {
	position: absolute;
	inset: 0;
	border-radius: 0.5rem;
	padding: 2px;
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);
	background-size: 200% 200%;
	animation: buttonGradientShift 3s ease infinite;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask-composite: exclude;
	z-index: 1;
}

.ai-button-outline:hover .ai-button-outline-border {
	background-size: 250% 250%;
	animation-duration: 1.5s;
	padding: 2.5px;
	box-shadow: 0 0 20px rgba(59, 130, 246, 0.4),
	            0 0 40px rgba(139, 92, 246, 0.3),
	            0 0 60px rgba(6, 182, 212, 0.2);
}

.ai-button-outline-shine {
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
	background-size: 200% 100%;
	transform: translateX(-100%) skewX(-15deg);
	transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
	border-radius: 0.5rem;
}

.ai-button-outline:hover .ai-button-outline-shine {
	transform: translateX(200%) skewX(-15deg);
	animation: buttonShimmer 1.5s ease-in-out infinite;
}

.ai-button-outline-glow {
	background: radial-gradient(circle at center, rgba(59, 130, 246, 0.2), transparent 70%);
	filter: blur(15px);
	transform: scale(0.8);
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	border-radius: 0.5rem;
}

.ai-button-outline:hover .ai-button-outline-glow {
	transform: scale(1.2);
	animation: buttonPulse 2s ease-in-out infinite;
}

.ai-button-outline-text {
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	background-size: 200% 200%;
	animation: buttonGradientShift 3s ease infinite;
	transition: all 0.3s ease;
	position: relative;
	z-index: 2;
}

.ai-button-outline:hover .ai-button-outline-text {
	background-size: 250% 250%;
	animation-duration: 1.5s;
	filter: drop-shadow(0 0 8px rgba(59, 130, 246, 0.6));
}

.ai-button-outline:hover {
	transform: translateY(-2px) scale(1.02);
}

.ai-button-outline:active {
	transform: translateY(0px) scale(0.98);
}

.ai-button-outline:focus {
	outline: none;
	box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.3);
}

/* Marquee Styles */
.marquee-container {
	overflow: hidden;
	width: 100%;
	position: relative;
}

.marquee-track {
	display: flex;
	align-items: center;
	width: fit-content;
	animation: marqueeScroll 30s linear infinite;
	will-change: transform;
}

.marquee-item {
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 2rem;
	min-width: 150px;
}

.marquee-item img {
	max-width: 100%;
	height: auto;
	filter: grayscale(100%);
	transition: all 0.3s ease;
}

.marquee-item:hover img {
	filter: grayscale(0%);
	transform: scale(1.1);
}

/* Pause animation on hover */
.marquee-container:hover .marquee-track {
	animation-play-state: paused;
}

@keyframes marqueeScroll {
	0% {
		transform: translateX(0);
	}
	100% {
		transform: translateX(-50%);
	}
}


.animated-gradient-1 {
	background:linear-gradient(90deg,#3b82f6,#3b82f6 8%,#8b5cf6 20%,#06b6d4 35%,#04CFFF 45%,#D8FF70 60%,#FFFFFF 75%,#FFFFFF);
	background-size:140% 100%;
	animation:Animation 5s ease infinite
  }
  .animated-gradient-2 {
	background:linear-gradient(90deg,#3b82f6,#3b82f6 8%,#8b5cf6 20%,#06b6d4 35%,#04CFFF 45%,#D8FF70 60%,#FFFFFF 75%,#FFFFFF);
	background-size:140% 100%;
	animation:Animation 5s ease infinite
  }
  @keyframes Animation {
	0% {
	  background-position:0 0
	}
	50% {
	  background-position:100% 0
	}
	to {
	  background-position:0 0
	}
  }
  .animated-gradient-1-vertical {
	background:linear-gradient(180deg,#3b82f6,#3b82f6 8%,#8b5cf6 20%,#06b6d4 35%,#04CFFF 45%,#D8FF70 60%,#FFFFFF 75%,#FFFFFF);
	background-size:100% 140%;
	animation:VerticalAnimation 6s ease infinite
  }
  @keyframes VerticalAnimation {
	0% {
	  background-position:0 0
	}
	50% {
	  background-position:0 40%
	}
	to {
	  background-position:0 0
	}
  }

  .bg-blur-circle {
	position:absolute;
	width:605px;
	height:460px;
	filter:blur(205px);
	border-radius:5000px;
	opacity:.7;
	z-index:0;
	transform:translateZ(0) scale(1);
	will-change:background-color,transform;
	transition:background-color .8s cubic-bezier(.4,0,.2,1);
	backface-visibility:hidden;
	transform-style:preserve-3d;
	-webkit-transform:translateZ(0) scale(1);
	-webkit-backface-visibility:hidden;
	-webkit-transform-style:preserve-3d;
	-webkit-perspective:1000px;
	contain:layout style paint;
	isolation:isolate;
	animation:safari-layer-keepalive 1ms linear infinite;
	animation-fill-mode:both
  }
  .dark .bg-blur-circle {
	opacity:.57
  }
  .bg-blur-layer {
	position:absolute;
	width:100%;
	height:100%;
	filter:blur(205px);
	border-radius:5000px;
	transition:opacity .8s cubic-bezier(.4,0,.2,1)
  }
  .bg-blur-layer.active {
	opacity:.7
  }
  .bg-blur-layer.\!active {
	opacity:.7!important
  }
  .dark .bg-blur-layer.active {
	opacity:.57
  }
  .dark .bg-blur-layer.\!active {
	opacity:.57!important
  }
  .bg-blur-layer.inactive {
	opacity:0
  }
  .bg-blur-right-cyan {
	left:calc(100vw - 468px);
	top:12px;
	background-color:#00d4ff;/*var(--dynamic-right-1,#00d4ff)*/
  }
  .dark .bg-blur-right-cyan {
	background-color:#2ce;/*var(--dynamic-right-1,#2ce)*/
  }
  .bg-blur-right-green {
	left:calc(100vw - 645px);
	top:376px;
	background-color:#0f8;/*var(--dynamic-right-2,#0f8)*/
  }
  .dark .bg-blur-right-green {
	background-color:#47cd89;/*var(--dynamic-right-2,#47cd89)*/
  }
  .bg-blur-left-orange {
	left:-209px;
	top:12px;
	background-color:#ff6b00;/*var(--dynamic-left-1,#ff6b00)*/
  }
  .dark .bg-blur-left-orange {
	background-color:#f38744;/*var(--dynamic-left-1,#f38744)*/
  }
  .bg-blur-left-pink {
	left:-77px;
	top:376px;
	background-color:#ff1493;/*var(--dynamic-left-2,#ff1493)*/
  }
  .dark .bg-blur-left-pink {
	background-color:#ee46bc;/*var(--dynamic-left-2,#ee46bc)*/
  }
  .bg-fade-right-bar {
	position:absolute;
	width:80px;
	height:1036px;
	top:0;
	background:linear-gradient(90deg,hsla(0,0%,100%,0),hsla(0,0%,100%,.2));
	border:1px solid hsla(0,0%,100%,.25);
	z-index:1;
	mask:linear-gradient(180deg,#000,#000 70%,transparent);
	-webkit-mask:linear-gradient(180deg,#000,#000 70%,transparent)
  }
  .dark .bg-fade-right-bar {
	background:linear-gradient(90deg,transparent,rgba(0,0,0,.2));
	border:1px solid rgba(0,0,0,.25)
  }
  .bg-fade-right-bar-1 {
	right:560px;
	opacity:.3
  }
  .bg-fade-right-bar-2 {
	right:480px;
	opacity:.4
  }
  .bg-fade-right-bar-3 {
	right:400px;
	opacity:.5
  }
  .bg-fade-right-bar-4 {
	right:320px;
	opacity:.6
  }
  .bg-fade-right-bar-5 {
	right:240px;
	opacity:.7
  }
  .bg-fade-right-bar-6 {
	right:160px;
	opacity:.8
  }
  .bg-fade-right-bar-7 {
	right:80px;
	opacity:.9
  }
  .bg-fade-right-bar-8 {
	right:0;
	opacity:1
  }
  .bg-fade-left-bar {
	position:absolute;
	width:80px;
	height:1036px;
	top:0;
	background:linear-gradient(90deg,hsla(0,0%,100%,.2),hsla(0,0%,100%,0));
	border:1px solid hsla(0,0%,100%,.25);
	z-index:0;
	mask:linear-gradient(180deg,#000,#000 70%,transparent);
	-webkit-mask:linear-gradient(180deg,#000,#000 70%,transparent)
  }
  .dark .bg-fade-left-bar {
	background:linear-gradient(90deg,rgba(0,0,0,.2),transparent);
	border:1px solid rgba(0,0,0,.25)
  }
  .bg-fade-left-bar-1 {
	left:0;
	opacity:1
  }
  .bg-fade-left-bar-2 {
	left:80px;
	opacity:.9
  }
  .bg-fade-left-bar-3 {
	left:160px;
	opacity:.8
  }
  .bg-fade-left-bar-4 {
	left:240px;
	opacity:.7
  }
  .bg-fade-left-bar-5 {
	left:320px;
	opacity:.6
  }
  .bg-fade-left-bar-6 {
	left:400px;
	opacity:.5
  }
  .bg-fade-left-bar-7 {
	left:480px;
	opacity:.4
  }
  .bg-fade-left-bar-8 {
	left:560px;
	opacity:.3
  }

/* Animated Border Lighting Effects */
.animated-borders-section {
	position: relative;
}

/* Top Border Animation */
.animated-border-top {
	position: relative;
	overflow: hidden;
}

.animated-border-top::before {
	content: '';
	position: absolute;
	top: -1px;
	left: -100%;
	width: 100%;
	height: 2px;
	background: linear-gradient(90deg, 
		transparent 0%, 
		rgba(59, 130, 246, 0.4) 15%, 
		rgba(139, 92, 246, 0.7) 35%, 
		rgba(6, 182, 212, 1) 50%, 
		rgba(139, 92, 246, 0.7) 65%, 
		rgba(59, 130, 246, 0.4) 85%, 
		transparent 100%);
	box-shadow: 0 0 8px rgba(59, 130, 246, 0.6),
	            0 0 16px rgba(139, 92, 246, 0.5),
	            0 0 24px rgba(6, 182, 212, 0.4);
	animation: borderLightMoveHorizontal 4s ease-in-out infinite;
	z-index: 1;
}

/* Bottom Border Animation */
.animated-border-bottom {
	position: relative;
	overflow: hidden;
}

.animated-border-bottom::after {
	content: '';
	position: absolute;
	bottom: -1px;
	left: -100%;
	width: 100%;
	height: 2px;
	background: linear-gradient(90deg, 
		transparent 0%, 
		rgba(59, 130, 246, 0.4) 15%, 
		rgba(139, 92, 246, 0.7) 35%, 
		rgba(6, 182, 212, 1) 50%, 
		rgba(139, 92, 246, 0.7) 65%, 
		rgba(59, 130, 246, 0.4) 85%, 
		transparent 100%);
	box-shadow: 0 0 8px rgba(59, 130, 246, 0.6),
	            0 0 16px rgba(139, 92, 246, 0.5),
	            0 0 24px rgba(6, 182, 212, 0.4);
	animation: borderLightMoveHorizontal 4s ease-in-out infinite;
	z-index: 1;
}

/* Right Border Animation */
.animated-border-right {
	position: relative;
	overflow: hidden;
}

.animated-border-right::after {
	content: '';
	position: absolute;
	right: -1px;
	top: -100%;
	width: 2px;
	height: 100%;
	background: linear-gradient(180deg, 
		transparent 0%, 
		rgba(59, 130, 246, 0.4) 15%, 
		rgba(139, 92, 246, 0.7) 35%, 
		rgba(6, 182, 212, 1) 50%, 
		rgba(139, 92, 246, 0.7) 65%, 
		rgba(59, 130, 246, 0.4) 85%, 
		transparent 100%);
	box-shadow: 2px 0 8px rgba(59, 130, 246, 0.6),
	            2px 0 16px rgba(139, 92, 246, 0.5),
	            2px 0 24px rgba(6, 182, 212, 0.4);
	animation: borderLightMoveVertical 4s ease-in-out infinite;
	z-index: 1;
}

/* Left Border Animation */
.animated-border-left {
	position: relative;
	overflow: hidden;
}

.animated-border-left::before {
	content: '';
	position: absolute;
	left: -1px;
	top: -100%;
	width: 2px;
	height: 100%;
	background: linear-gradient(180deg, 
		transparent 0%, 
		rgba(59, 130, 246, 0.4) 15%, 
		rgba(139, 92, 246, 0.7) 35%, 
		rgba(6, 182, 212, 1) 50%, 
		rgba(139, 92, 246, 0.7) 65%, 
		rgba(59, 130, 246, 0.4) 85%, 
		transparent 100%);
	box-shadow: -2px 0 8px rgba(59, 130, 246, 0.6),
	            -2px 0 16px rgba(139, 92, 246, 0.5),
	            -2px 0 24px rgba(6, 182, 212, 0.4);
	animation: borderLightMoveVertical 4s ease-in-out infinite;
	z-index: 1;
}

/* Keyframe Animations */
@keyframes borderLightMoveHorizontal {
	0% {
		left: -100%;
		opacity: 0;
	}
	10% {
		opacity: 1;
	}
	90% {
		opacity: 1;
	}
	100% {
		left: 100%;
		opacity: 0;
	}
}

@keyframes borderLightMoveVertical {
	0% {
		top: -100%;
		opacity: 0;
	}
	10% {
		opacity: 1;
	}
	90% {
		opacity: 1;
	}
	100% {
		top: 100%;
		opacity: 0;
	}
}

/* Staggered Animation Delays for Different Borders */
.animated-border-top::before {
	animation-delay: 0.5s;
}

.animated-border-bottom:nth-of-type(1)::after {
	animation-delay: 0s;
}

.animated-border-bottom:nth-of-type(2)::after {
	animation-delay: 1s;
}

.animated-border-right:nth-of-type(1)::after {
	animation-delay: 0.5s;
}

.animated-border-right:nth-of-type(2)::after {
	animation-delay: 1.5s;
}

.animated-border-right:nth-of-type(3)::after {
	animation-delay: 2s;
}

.animated-border-right:nth-of-type(4)::after {
	animation-delay: 0.8s;
}

.animated-border-right:nth-of-type(5)::after {
	animation-delay: 1.3s;
}

.animated-border-left:nth-of-type(1)::before {
	animation-delay: 0.3s;
}

.animated-border-left:nth-of-type(2)::before {
	animation-delay: 1.2s;
}

.animated-border-left:nth-of-type(3)::before {
	animation-delay: 1.8s;
}

/* Enhanced glow effect on hover */
.animated-border-top:hover::before,
.animated-border-bottom:hover::after,
.animated-border-right:hover::after,
.animated-border-left:hover::before {
	animation-duration: 2s;
	box-shadow: 0 0 12px rgba(59, 130, 246, 0.8),
	            0 0 24px rgba(139, 92, 246, 0.7),
	            0 0 36px rgba(6, 182, 212, 0.6);
}

/* Additional pulse effect for continuous visibility */
@keyframes borderPulse {
	0%, 100% {
		opacity: 0.6;
	}
	50% {
		opacity: 1;
	}
}

/* Optional: Add a subtle continuous glow */
.animated-border-bottom::before,
.animated-border-right::after,
.animated-border-left::after {
	content: '';
	position: absolute;
	opacity: 0.1;
	z-index: 0;
}

.animated-border-bottom::before {
	bottom: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: linear-gradient(90deg, 
		rgba(59, 130, 246, 0.2) 0%, 
		rgba(139, 92, 246, 0.2) 50%, 
		rgba(6, 182, 212, 0.2) 100%);
	animation: borderPulse 3s ease-in-out infinite;
}

/* Glass AI Section Styles */
.glass-ai-section {
	position: relative;
	background: linear-gradient(180deg, 
		rgba(255, 255, 255, 0.95) 0%, 
		rgba(249, 250, 251, 0.98) 50%, 
		rgba(255, 255, 255, 0.95) 100%);
}

.glass-ai-section.counters-scroll {
	background-color: rgba(250, 250, 250, 0.8);
	background-image: radial-gradient(circle, rgba(229, 231, 235, 0.6) 1.5px, transparent 1.5px);
	background-size: 25px 25px;
	backdrop-filter: blur(1px);
	-webkit-backdrop-filter: blur(1px);
}

/* Dark Mode Glass AI Section with Dot Pattern */
.glass-ai-section.counters-scroll-dark {
	background-color: rgba(15, 23, 42, 0.6);
	background-image: radial-gradient(circle, rgba(255, 255, 255, 0.1) 1.5px, transparent 1.5px);
	background-size: 25px 25px;
	backdrop-filter: blur(1px);
	-webkit-backdrop-filter: blur(1px);
}

/* Animated Background Orbs */
.glass-ai-bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
	z-index: 0;
}

.glass-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	opacity: 0.4;
	animation: glassOrbFloat 20s ease-in-out infinite;
}

.glass-orb-1 {
	width: 400px;
	height: 400px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.6), transparent);
	top: -100px;
	left: -100px;
	animation-delay: 0s;
	animation-duration: 25s;
}

.glass-orb-2 {
	width: 350px;
	height: 350px;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.6), transparent);
	bottom: -50px;
	right: -50px;
	animation-delay: 5s;
	animation-duration: 22s;
}

.glass-orb-3 {
	width: 300px;
	height: 300px;
	background: radial-gradient(circle, rgba(6, 182, 212, 0.6), transparent);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	animation-delay: 10s;
	animation-duration: 28s;
}

@keyframes glassOrbFloat {
	0%, 100% {
		transform: translate(0, 0) scale(1);
		opacity: 0.4;
	}
	25% {
		transform: translate(50px, -50px) scale(1.1);
		opacity: 0.5;
	}
	50% {
		transform: translate(-30px, 30px) scale(0.9);
		opacity: 0.45;
	}
	75% {
		transform: translate(30px, 50px) scale(1.05);
		opacity: 0.5;
	}
}

/* Glass AI Card */
.glass-ai-card {
	background: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border: 1px solid rgba(255, 255, 255, 0.5);
	box-shadow: 0 8px 32px rgba(59, 130, 246, 0.1),
	            0 0 0 1px rgba(255, 255, 255, 0.3) inset,
	            0 0 60px rgba(139, 92, 246, 0.05);
	padding: 3rem;
	position: relative;
	overflow: hidden;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.glass-ai-card::before {
	content: '';
	position: absolute;
	inset: 0;
	padding: 2px;
	background: linear-gradient(135deg, 
		rgba(59, 130, 246, 0.3) 0%, 
		rgba(139, 92, 246, 0.2) 50%, 
		rgba(6, 182, 212, 0.3) 100%);
	background-size: 200% 200%;
	animation: buttonGradientShift 4s ease infinite;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask-composite: exclude;
	opacity: 0;
	transition: opacity 0.4s ease;
	z-index: 0;
}

.glass-ai-card:hover::before {
	opacity: 1;
}

.glass-ai-card:hover {
	/* transform: translateY(-4px); */
	box-shadow: 0 12px 48px rgba(59, 130, 246, 0.15),
	            0 0 0 1px rgba(255, 255, 255, 0.4) inset,
	            0 0 80px rgba(139, 92, 246, 0.1);
	background: rgba(255, 255, 255, 0.8);
}

/* Glass AI Shine Effect */
.glass-ai-shine {
	position: absolute;
	top: -50%;
	left: -50%;
	width: 200%;
	height: 200%;
	background: linear-gradient(135deg, 
		transparent 0%, 
		rgba(255, 255, 255, 0.1) 45%, 
		rgba(255, 255, 255, 0.3) 50%, 
		rgba(255, 255, 255, 0.1) 55%, 
		transparent 100%);
	transform: rotate(45deg);
	animation: glassShine 6s ease-in-out infinite;
	z-index: 1;
	pointer-events: none;
}

@keyframes glassShine {
	0% {
		transform: translateX(-100%) translateY(-100%) rotate(45deg);
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		transform: translateX(100%) translateY(100%) rotate(45deg);
		opacity: 0;
	}
}

/* Glass AI Glow Effect */
.glass-ai-glow {
	position: absolute;
	inset: -2px;
	border-radius: 24px;
	background: linear-gradient(135deg, 
		rgba(59, 130, 246, 0.2) 0%, 
		rgba(139, 92, 246, 0.15) 50%, 
		rgba(6, 182, 212, 0.2) 100%);
	filter: blur(20px);
	opacity: 0;
	transition: opacity 0.4s ease;
	z-index: -1;
	animation: glassGlowPulse 4s ease-in-out infinite;
}

.glass-ai-card:hover .glass-ai-glow {
	opacity: 0.6;
	animation-duration: 2s;
}

@keyframes glassGlowPulse {
	0%, 100% {
		opacity: 0;
		transform: scale(0.95);
	}
	50% {
		opacity: 0.3;
		transform: scale(1.05);
	}
}

/* Schedule Section Container */
.schedule-section-container {
	position: relative;
	width: 100%;
}

/* Confirmation Form Overlay */
.confirmation-form-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 100;
	opacity: 0;
	transform: translateY(20px);
	transition: opacity 0.6s ease, transform 0.6s ease;
	pointer-events: none;
	visibility: hidden;
}

.confirmation-form-overlay.show {
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
	visibility: visible;
}

.confirmation-form-overlay.hidden {
	display: none;
	visibility: hidden;
}

/* Date Time Selection Section */
#dateTimeSelectionSection {
	transition: opacity 0.4s ease, transform 0.4s ease;
	position: relative;
}

#dateTimeSelectionSection.hide {
	opacity: 0;
	transform: translateY(-20px);
	pointer-events: none;
	visibility: hidden;
	height: 0;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

/* AI Transition Overlay */
.ai-transition-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
	background: rgba(255, 255, 255, 0.95);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
	opacity: 0;
	animation: overlayFadeIn 0.3s ease forwards;
}

.ai-transition-overlay.hidden {
	display: none;
	opacity: 0;
}

@keyframes overlayFadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

.ai-transition-overlay.hidden {
	display: none;
}

/* Schedule Button AI Animation */
.schedule-button-wrapper {
	position: relative;
	display: inline-block;
	opacity: 0;
	transform: scale(0.8) translateY(10px);
}

.schedule-button-wrapper.schedule-button-appear {
	opacity: 1;
	transform: scale(1) translateY(0);
	animation: scheduleButtonEntrance 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

@keyframes scheduleButtonEntrance {
	0% {
		opacity: 0;
		transform: scale(0.8) translateY(10px);
	}
	60% {
		transform: scale(1.05) translateY(-2px);
	}
	100% {
		opacity: 1;
		transform: scale(1) translateY(0);
	}
}

.schedule-button-wrapper.hidden {
	display: none;
}

/* Schedule Button Particles */
.schedule-button-particles {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	height: 100%;
	pointer-events: none;
	z-index: 1;
}

.schedule-particle {
	position: absolute;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: linear-gradient(135deg, #3b82f6, #8b5cf6, #06b6d4);
	box-shadow: 0 0 8px rgba(59, 130, 246, 0.8);
	opacity: 0;
	animation: scheduleParticlePop 1s ease-out forwards;
}

.schedule-particle-1 {
	top: 20%;
	left: 20%;
	background: #3b82f6;
	animation-delay: 0.1s;
}

.schedule-particle-2 {
	top: 20%;
	right: 20%;
	background: #8b5cf6;
	animation-delay: 0.2s;
}

.schedule-particle-3 {
	bottom: 20%;
	left: 20%;
	background: #06b6d4;
	animation-delay: 0.3s;
}

.schedule-particle-4 {
	bottom: 20%;
	right: 20%;
	background: #8b5cf6;
	animation-delay: 0.4s;
}

@keyframes scheduleParticlePop {
	0% {
		opacity: 0;
		transform: translate(0, 0) scale(0);
	}
	50% {
		opacity: 1;
		transform: translate(var(--tx, 0), var(--ty, 0)) scale(1.5);
	}
	100% {
		opacity: 0;
		transform: translate(var(--tx, 0), var(--ty, 0)) scale(0.5);
	}
}

.schedule-button-wrapper.schedule-button-appear .schedule-particle-1 {
	--tx: -30px;
	--ty: -30px;
}

.schedule-button-wrapper.schedule-button-appear .schedule-particle-2 {
	--tx: 30px;
	--ty: -30px;
}

.schedule-button-wrapper.schedule-button-appear .schedule-particle-3 {
	--tx: -30px;
	--ty: 30px;
}

.schedule-button-wrapper.schedule-button-appear .schedule-particle-4 {
	--tx: 30px;
	--ty: 30px;
}

/* Schedule Button Ripple Effect */
.schedule-button-ripple {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 0;
	height: 0;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.4), transparent);
	opacity: 0;
	pointer-events: none;
	z-index: 0;
}

.schedule-button-wrapper.schedule-button-appear .schedule-button-ripple {
	animation: scheduleRipple 1s ease-out;
}

@keyframes scheduleRipple {
	0% {
		width: 0;
		height: 0;
		opacity: 0.8;
	}
	100% {
		width: 200px;
		height: 200px;
		opacity: 0;
	}
}

/* Schedule Button AI Glow */
.schedule-button-ai-glow {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 120%;
	height: 120%;
	border-radius: 9999px;
	background: linear-gradient(135deg, 
		rgba(59, 130, 246, 0.3) 0%,
		rgba(139, 92, 246, 0.3) 50%,
		rgba(6, 182, 212, 0.3) 100%
	);
	filter: blur(20px);
	opacity: 0;
	pointer-events: none;
	z-index: -1;
}

.schedule-button-wrapper.schedule-button-appear .schedule-button-ai-glow {
	animation: scheduleGlowAppear 0.8s ease-out forwards, scheduleGlowPulse 2s ease-in-out 0.8s infinite;
}

/* Continuous subtle pulse for visibility */
.schedule-button-wrapper.schedule-button-appear #scheduleButton {
	animation: scheduleButtonPulse 2s ease-in-out infinite 1s;
}

@keyframes scheduleButtonPulse {
	0%, 100% {
		box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.4);
	}
	50% {
		box-shadow: 0 0 0 8px rgba(59, 130, 246, 0);
	}
}

@keyframes scheduleGlowAppear {
	0% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(0.5);
	}
	100% {
		opacity: 0.6;
		transform: translate(-50%, -50%) scale(1);
	}
}

@keyframes scheduleGlowPulse {
	0%, 100% {
		opacity: 0.6;
		transform: translate(-50%, -50%) scale(1);
	}
	50% {
		opacity: 0.9;
		transform: translate(-50%, -50%) scale(1.1);
	}
}

/* Schedule Button Icon Animation */
.schedule-icon {
	transform-origin: center;
}

.schedule-button-wrapper.schedule-button-appear .schedule-icon {
	animation: scheduleIconSpin 0.6s ease-out 0.2s;
}

@keyframes scheduleIconSpin {
	0% {
		transform: rotate(-180deg) scale(0);
		opacity: 0;
	}
	50% {
		transform: rotate(0deg) scale(1.2);
		opacity: 1;
	}
	100% {
		transform: rotate(0deg) scale(1);
		opacity: 1;
	}
}

/* Neural Network Animation */
.ai-neural-network {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0.8;
}

.neural-line {
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
	animation: neuralFlow 2s ease-in-out infinite;
	filter: drop-shadow(0 0 3px rgba(59, 130, 246, 0.5));
}

.neural-line-1 { animation-delay: 0s; }
.neural-line-2 { animation-delay: 0.2s; }
.neural-line-3 { animation-delay: 0.4s; }
.neural-line-4 { animation-delay: 0.6s; }
.neural-line-5 { animation-delay: 0.8s; }

.neural-node {
	animation: neuralPulse 1.5s ease-in-out infinite;
	filter: drop-shadow(0 0 8px currentColor);
}

.neural-node-1 { animation-delay: 0s; }
.neural-node-2 { animation-delay: 0.25s; }
.neural-node-3 { animation-delay: 0.5s; }
.neural-node-4 { animation-delay: 0.75s; }
.neural-node-5 { animation-delay: 1s; }
.neural-node-6 { animation-delay: 1.25s; }

@keyframes neuralFlow {
	0% {
		stroke-dashoffset: 1000;
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		stroke-dashoffset: 0;
		opacity: 0.8;
	}
}

@keyframes neuralPulse {
	0%, 100% {
		r: 6;
		opacity: 0.8;
	}
	50% {
		r: 10;
		opacity: 1;
	}
}

/* AI Particles */
.ai-particles {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.ai-particle {
	position: absolute;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: linear-gradient(135deg, #3b82f6, #8b5cf6, #06b6d4);
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.8);
	animation: particleFloat 3s ease-in-out infinite;
}

.ai-particle-1 {
	top: 20%;
	left: 10%;
	animation-delay: 0s;
	background: #3b82f6;
}

.ai-particle-2 {
	top: 40%;
	left: 30%;
	animation-delay: 0.4s;
	background: #8b5cf6;
}

.ai-particle-3 {
	top: 60%;
	left: 50%;
	animation-delay: 0.8s;
	background: #06b6d4;
}

.ai-particle-4 {
	top: 30%;
	left: 70%;
	animation-delay: 1.2s;
	background: #3b82f6;
}

.ai-particle-5 {
	top: 70%;
	left: 20%;
	animation-delay: 1.6s;
	background: #8b5cf6;
}

.ai-particle-6 {
	top: 50%;
	left: 80%;
	animation-delay: 2s;
	background: #06b6d4;
}

.ai-particle-7 {
	top: 10%;
	left: 60%;
	animation-delay: 2.4s;
	background: #3b82f6;
}

.ai-particle-8 {
	top: 80%;
	left: 90%;
	animation-delay: 2.8s;
	background: #8b5cf6;
}

@keyframes particleFloat {
	0%, 100% {
		transform: translate(0, 0) scale(1);
		opacity: 0.6;
	}
	25% {
		transform: translate(30px, -40px) scale(1.2);
		opacity: 1;
	}
	50% {
		transform: translate(-20px, -60px) scale(0.8);
		opacity: 0.8;
	}
	75% {
		transform: translate(40px, -30px) scale(1.1);
		opacity: 1;
	}
}

/* Glowing Orbs */
.ai-glow-orbs {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

.ai-glow-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(40px);
	animation: orbPulse 3s ease-in-out infinite;
}

.ai-glow-orb-1 {
	width: 200px;
	height: 200px;
	top: 20%;
	left: 15%;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.6), transparent);
	animation-delay: 0s;
}

.ai-glow-orb-2 {
	width: 150px;
	height: 150px;
	top: 60%;
	right: 20%;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.6), transparent);
	animation-delay: 1s;
}

.ai-glow-orb-3 {
	width: 180px;
	height: 180px;
	bottom: 20%;
	left: 50%;
	background: radial-gradient(circle, rgba(6, 182, 212, 0.6), transparent);
	animation-delay: 2s;
}

@keyframes orbPulse {
	0%, 100% {
		transform: scale(1);
		opacity: 0.4;
	}
	50% {
		transform: scale(1.3);
		opacity: 0.7;
	}
}

/* Data Stream Effect */
.ai-data-stream {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	overflow: hidden;
}

.data-stream-line {
	position: absolute;
	width: 2px;
	height: 100%;
	background: linear-gradient(to bottom, 
		transparent 0%,
		rgba(59, 130, 246, 0.3) 20%,
		rgba(139, 92, 246, 0.5) 50%,
		rgba(6, 182, 212, 0.3) 80%,
		transparent 100%
	);
	animation: dataStream 2s linear infinite;
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
}

.data-stream-line-1 {
	left: 25%;
	animation-delay: 0s;
}

.data-stream-line-2 {
	left: 50%;
	animation-delay: 0.7s;
}

.data-stream-line-3 {
	left: 75%;
	animation-delay: 1.4s;
}

@keyframes dataStream {
	0% {
		transform: translateY(-100%);
		opacity: 0;
	}
	10% {
		opacity: 1;
	}
	90% {
		opacity: 1;
	}
	100% {
		transform: translateY(100%);
		opacity: 0;
	}
}

/* Loading Text Animation */
.ai-loading-text {
	position: absolute;
	bottom: 30%;
	left: 50%;
	transform: translateX(-50%);
	font-size: 24px;
	font-weight: 600;
	font-family: "DM Sans", sans-serif;
	background: linear-gradient(135deg, #3b82f6, #8b5cf6, #06b6d4);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	display: flex;
	gap: 2px;
}

.loading-text-char {
	display: inline-block;
	animation: charBounce 1.4s ease-in-out infinite;
}

.loading-text-char:nth-child(1) { animation-delay: 0s; }
.loading-text-char:nth-child(2) { animation-delay: 0.1s; }
.loading-text-char:nth-child(3) { animation-delay: 0.2s; }
.loading-text-char:nth-child(4) { animation-delay: 0.3s; }
.loading-text-char:nth-child(5) { animation-delay: 0.4s; }
.loading-text-char:nth-child(6) { animation-delay: 0.5s; }
.loading-text-char:nth-child(7) { animation-delay: 0.6s; }
.loading-text-char:nth-child(8) { animation-delay: 0.7s; }
.loading-text-char:nth-child(9) { animation-delay: 0.8s; }
.loading-text-char:nth-child(10) { animation-delay: 0.9s; }
.loading-text-char:nth-child(11) { animation-delay: 1s; }
.loading-text-char:nth-child(12) { animation-delay: 1.1s; }
.loading-text-char:nth-child(13) { animation-delay: 1.2s; }

@keyframes charBounce {
	0%, 100% {
		transform: translateY(0);
		opacity: 1;
	}
	50% {
		transform: translateY(-10px);
		opacity: 0.7;
	}
}

/* Glass AI Content */
.glass-ai-content {
	position: relative;
	z-index: 2;
}

.glass-ai-title {
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
	transition: all 0.3s ease;
}

.glass-ai-card:hover .glass-ai-title {
	text-shadow: 0 4px 12px rgba(59, 130, 246, 0.2);
}

.glass-ai-text {
	transition: all 0.3s ease;
}

.glass-ai-card:hover .glass-ai-text {
	color: #374151;
}

/* AI Features Showcase Section */
.ai-features-showcase {
	position: relative;
	background: linear-gradient(180deg, 
		rgba(255, 255, 255, 0.98) 0%, 
		rgba(249, 250, 251, 0.95) 50%, 
		rgba(255, 255, 255, 0.98) 100%);
	overflow-x: hidden;
}

/* Animated Background Orbs */
.ai-showcase-bg {
	position: absolute;
	inset: 0;
	overflow: hidden;
	z-index: 0;
}

.ai-showcase-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(100px);
	opacity: 0.3;
	animation: showcaseOrbFloat 25s ease-in-out infinite;
}

.ai-showcase-orb-1 {
	width: 500px;
	height: 500px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.5), transparent);
	top: -150px;
	left: -150px;
	animation-delay: 0s;
	animation-duration: 30s;
}

.ai-showcase-orb-2 {
	width: 450px;
	height: 450px;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.5), transparent);
	bottom: -100px;
	right: -100px;
	animation-delay: 8s;
	animation-duration: 28s;
}

.ai-showcase-orb-3 {
	width: 400px;
	height: 400px;
	background: radial-gradient(circle, rgba(6, 182, 212, 0.5), transparent);
	top: 50%;
	right: 20%;
	transform: translateY(-50%);
	animation-delay: 15s;
	animation-duration: 32s;
}

@keyframes showcaseOrbFloat {
	0%, 100% {
		transform: translate(0, 0) scale(1);
		opacity: 0.3;
	}
	25% {
		transform: translate(60px, -60px) scale(1.15);
		opacity: 0.4;
	}
	50% {
		transform: translate(-40px, 40px) scale(0.9);
		opacity: 0.35;
	}
	75% {
		transform: translate(40px, 60px) scale(1.1);
		opacity: 0.4;
	}
}

/* AI Badge */
.ai-badge {
	background: rgba(255, 255, 255, 0.9);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(59, 130, 246, 0.2);
	color: #3b82f6;
	box-shadow: 0 4px 12px rgba(59, 130, 246, 0.1);
	overflow: hidden;
}

.ai-badge-glow {
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
	opacity: 0;
	transition: opacity 0.3s ease;
}

.ai-badge:hover .ai-badge-glow {
	opacity: 1;
}

/* 3D Container */
.ai-3d-container {
	position: relative;
	width: 100%;
	height: 450px;
	perspective: 2500px;
	perspective-origin: center center;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 4rem 0;
	overflow: visible;
}

.ai-3d-scene {
	position: relative;
	width: 100%;
	height: 100%;
	transform-style: preserve-3d;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
	overflow: visible;
}

/* 3D Feature Cards */
.ai-feature-3d-card {
	position: absolute;
	width: 350px;
	background: rgba(255, 255, 255, 0.85);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border-radius: 24px;
	border: 1px solid rgba(255, 255, 255, 0.7);
	padding: 2.5rem;
	transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
	cursor: pointer;
	overflow: hidden;
	box-shadow: 0 8px 32px rgba(59, 130, 246, 0.12),
	            0 0 0 1px rgba(255, 255, 255, 0.5) inset;
	transform-style: preserve-3d;
	margin: 0;
}

/* 3D Card Positions - Dynamic based on slide index */
.ai-card-item {
	transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
	opacity: 0.7;
	z-index: 1;
}

.ai-card-item.active {
	opacity: 1;
	z-index: 10;
}

/* Navigation Controls */
.ai-3d-nav-controls {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	transform: translateY(-50%);
	display: flex;
	justify-content: space-between;
	pointer-events: none;
	z-index: 100;
	padding: 0 2rem;
}

.ai-3d-nav-btn {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.9);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	border: 1px solid rgba(59, 130, 246, 0.2);
	color: #3b82f6;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease;
	pointer-events: all;
	box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);
}

.ai-3d-nav-btn:hover {
	background: rgba(255, 255, 255, 1);
	border-color: rgba(59, 130, 246, 0.4);
	color: #2563eb;
	transform: scale(1.1);
	box-shadow: 0 6px 20px rgba(59, 130, 246, 0.25);
}

.ai-3d-nav-btn:active {
	transform: scale(0.95);
}

/* Dots Navigation */
.ai-3d-dots {
	position: absolute;
	bottom: -100px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
	gap: 0.75rem;
	z-index: 100;
}

.ai-3d-dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: rgba(59, 130, 246, 0.3);
	border: 2px solid rgba(59, 130, 246, 0.2);
	cursor: pointer;
	transition: all 0.3s ease;
	padding: 0;
}

.ai-3d-dot:hover {
	background: rgba(59, 130, 246, 0.5);
	transform: scale(1.2);
}

.ai-3d-dot.active {
	background: linear-gradient(135deg, #3b82f6, #8b5cf6);
	border-color: rgba(59, 130, 246, 0.6);
	width: 32px;
	border-radius: 6px;
	box-shadow: 0 0 12px rgba(59, 130, 246, 0.5);
}

/* Hover Effects for 3D Cards */
.ai-feature-3d-card:hover {
	box-shadow: 0 20px 60px rgba(59, 130, 246, 0.25),
	            0 0 0 1px rgba(255, 255, 255, 0.6) inset,
	            0 0 80px rgba(139, 92, 246, 0.15);
}

.ai-feature-3d-card.active:hover {
	transform: translateZ(120px) scale(1.08) !important;
	z-index: 15 !important;
}

/* Responsive 3D Layout - Moved to responsive.css */

/* AI Feature Showcase Cards (fallback) */
.ai-feature-showcase-card {
	position: relative;
	background: rgba(255, 255, 255, 0.8);
	backdrop-filter: blur(15px);
	-webkit-backdrop-filter: blur(15px);
	border-radius: 20px;
	border: 1px solid rgba(255, 255, 255, 0.6);
	padding: 2rem;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	cursor: pointer;
	overflow: hidden;
	box-shadow: 0 4px 20px rgba(59, 130, 246, 0.08),
	            0 0 0 1px rgba(255, 255, 255, 0.4) inset;
}

.ai-feature-3d-card::before,
.ai-feature-showcase-card::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, 
		rgba(59, 130, 246, 0.05) 0%, 
		rgba(139, 92, 246, 0.03) 50%, 
		rgba(6, 182, 212, 0.05) 100%);
	opacity: 0;
	transition: opacity 0.4s ease;
	border-radius: 24px;
	z-index: 0;
}

.ai-feature-3d-card:hover::before,
.ai-feature-showcase-card:hover::before {
	opacity: 1;
}

.ai-feature-showcase-card:hover {
	transform: translateY(-8px);
	box-shadow: 0 12px 40px rgba(59, 130, 246, 0.15),
	            0 0 0 1px rgba(255, 255, 255, 0.5) inset,
	            0 0 60px rgba(139, 92, 246, 0.1);
	background: rgba(255, 255, 255, 0.95);
}

/* Feature Card Glow */
.ai-feature-card-glow {
	position: absolute;
	inset: -3px;
	border-radius: 20px;
	background: radial-gradient(circle at center, rgba(59, 130, 246, 0.2), transparent 70%);
	filter: blur(25px);
	opacity: 0;
	transition: opacity 0.5s ease;
	z-index: -1;
}

.ai-feature-3d-card:hover .ai-feature-card-glow,
.ai-feature-showcase-card:hover .ai-feature-card-glow {
	opacity: 0.6;
	animation: featureCardGlowPulse 2s ease-in-out infinite;
}

/* Feature Card Border */
.ai-feature-card-border {
	position: absolute;
	inset: 0;
	border-radius: 20px;
	padding: 2px;
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);
	background-size: 200% 200%;
	animation: buttonGradientShift 4s ease infinite;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask-composite: exclude;
	opacity: 0;
	transition: opacity 0.4s ease;
	z-index: 0;
}

.ai-feature-3d-card:hover .ai-feature-card-border,
.ai-feature-showcase-card:hover .ai-feature-card-border {
	opacity: 1;
	animation-duration: 2s;
	box-shadow: 0 0 20px rgba(59, 130, 246, 0.4),
	            0 0 40px rgba(139, 92, 246, 0.3);
}

@keyframes featureCardGlowPulse {
	0%, 100% {
		opacity: 0.6;
		transform: scale(1);
	}
	50% {
		opacity: 0.8;
		transform: scale(1.05);
	}
}

/* Feature Icon Wrapper */
.ai-feature-icon-wrapper {
	position: relative;
	display: inline-block;
	margin-bottom: 1.5rem;
}

.ai-feature-icon {
	position: relative;
	width: 64px;
	height: 64px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1));
	border-radius: 16px;
	border: 1px solid rgba(59, 130, 246, 0.2);
	color: #3b82f6;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	z-index: 1;
}

.ai-feature-icon-wrapper::before {
	content: '';
	position: absolute;
	inset: -8px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.2), transparent);
	border-radius: 20px;
	opacity: 0;
	transform: scale(0.5);
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	filter: blur(15px);
	z-index: 0;
}

.ai-feature-3d-card:hover .ai-feature-icon-wrapper::before,
.ai-feature-showcase-card:hover .ai-feature-icon-wrapper::before {
	opacity: 1;
	transform: scale(1.3);
	animation: featureIconGlow 2s ease-in-out infinite;
}

.ai-feature-3d-card:hover .ai-feature-icon,
.ai-feature-showcase-card:hover .ai-feature-icon {
	transform: translateY(-4px) scale(1.1) rotate(5deg);
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.2), rgba(139, 92, 246, 0.2));
	border-color: rgba(59, 130, 246, 0.4);
	color: #2563eb;
	box-shadow: 0 8px 24px rgba(59, 130, 246, 0.3);
}

@keyframes featureIconGlow {
	0%, 100% {
		opacity: 0.2;
		transform: scale(1.3);
	}
	50% {
		opacity: 0.4;
		transform: scale(1.5);
	}
}

/* Feature Title */
.ai-feature-title {
	font-size: 1.5rem;
	font-weight: 600;
	margin-bottom: 1rem;
	color: #112030;
	transition: all 0.3s ease;
	position: relative;
	z-index: 1;
}

.ai-feature-3d-card:hover .ai-feature-title,
.ai-feature-showcase-card:hover .ai-feature-title {
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	background-size: 200% 200%;
	animation: gradientShift 3s ease infinite;
}

/* Feature Description */
.ai-feature-description {
	color: #6b7280;
	font-size: 0.95rem;
	line-height: 1.6;
	margin-bottom: 1.5rem;
	transition: all 0.3s ease;
	position: relative;
	z-index: 1;
}

.ai-feature-3d-card:hover .ai-feature-description,
.ai-feature-showcase-card:hover .ai-feature-description {
	color: #4b5563;
	transform: translateX(4px);
}

/* Feature Link */
.ai-feature-link {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: #3b82f6;
	font-size: 0.9rem;
	font-weight: 500;
	transition: all 0.3s ease;
	position: relative;
	z-index: 1;
}

.ai-feature-link svg {
	transition: transform 0.3s ease;
}

.ai-feature-3d-card:hover .ai-feature-link,
.ai-feature-showcase-card:hover .ai-feature-link {
	color: #2563eb;
	transform: translateX(4px);
}

.ai-feature-3d-card:hover .ai-feature-link svg,
.ai-feature-showcase-card:hover .ai-feature-link svg {
	transform: translateX(4px);
}

.ai-feature-link::after {
	content: '';
	position: absolute;
	bottom: -2px;
	left: 0;
	width: 0;
	height: 2px;
	background: linear-gradient(90deg, #3b82f6, #8b5cf6);
	transition: width 0.3s ease;
}

.ai-feature-3d-card:hover .ai-feature-link::after,
.ai-feature-showcase-card:hover .ai-feature-link::after {
	width: 100%;
}
.counters-scroll {
	background-color: #FAFAFA;
	background-image: radial-gradient(circle, rgba(229, 231, 235, 1) 1.5px, transparent 1.5px);
	background-size: 25px 25px;
}

/* Dark Mode Dot Pattern */
.counters-scroll-dark {
	background-color: rgba(15, 23, 42, 0.5);
	background-image: radial-gradient(circle, rgba(255, 255, 255, 0.1) 1.5px, transparent 1.5px);
	background-size: 25px 25px;
	backdrop-filter: blur(1px);
	-webkit-backdrop-filter: blur(1px);
}

/* Dark Mode Dot Pattern - Alternative with brighter dots */
.counters-scroll-dark-bright {
	background-color: rgba(15, 23, 42, 0.5);
	background-image: radial-gradient(circle, rgba(255, 255, 255, 0.15) 1.5px, transparent 1.5px);
	background-size: 25px 25px;
	backdrop-filter: blur(1px);
	-webkit-backdrop-filter: blur(1px);
}

/* Dark Glass Morphism Effects */
.dark-glass-section {
	position: relative;
	padding: 1rem;
	background: linear-gradient(180deg, 
		rgba(2, 6, 23, 0.95) 0%,
		rgba(15, 23, 42, 0.98) 50%,
		rgba(2, 6, 23, 0.95) 100%);
}

.dark-glass-box {
	position: relative;
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.dark-glass-box:hover {
	/* transform: translateY(-4px); */
}

.dark-glass-bg {
	background: linear-gradient(135deg, 
		rgba(15, 23, 42, 0.8) 0%,
		rgba(30, 41, 59, 0.7) 50%,
		rgba(15, 23, 42, 0.8) 100%);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 
		0 8px 32px rgba(0, 0, 0, 0.4),
		inset 0 1px 0 rgba(255, 255, 255, 0.1),
		inset 0 -1px 0 rgba(0, 0, 0, 0.2);
	transition: all 0.4s ease;
}

.dark-glass-box:hover .dark-glass-bg {
	background: linear-gradient(135deg, 
		rgba(15, 23, 42, 0.9) 0%,
		rgba(30, 41, 59, 0.85) 50%,
		rgba(15, 23, 42, 0.9) 100%);
	box-shadow: 
		0 12px 48px rgba(59, 130, 246, 0.2),
		0 0 0 1px rgba(59, 130, 246, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.15),
		inset 0 -1px 0 rgba(0, 0, 0, 0.2);
}

.dark-glass-shine {
	position: absolute;
	top: 0;
	left: -100%;
	width: 100%;
	height: 100%;
	display: none;
	background: linear-gradient(
		90deg,
		transparent,
		rgba(255, 255, 255, 0.1),
		transparent
	);
	animation: darkGlassShine 3s infinite;
	pointer-events: none;
	z-index: 1;
	border-radius: inherit;
}

@keyframes darkGlassShine {
	0% {
		left: -100%;
	}
	50% {
		left: 100%;
	}
	100% {
		left: 100%;
	}
}

.dark-glass-glow {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 0;
	height: 0;
	background: radial-gradient(
		circle,
		rgba(59, 130, 246, 0.3) 0%,
		rgba(139, 92, 246, 0.2) 50%,
		transparent 70%
	);
	transform: translate(-50%, -50%);
	transition: width 0.6s ease, height 0.6s ease;
	pointer-events: none;
	z-index: 0;
	border-radius: 50%;
	opacity: 0;
}

.dark-glass-box:hover .dark-glass-glow {
	width: 200%;
	height: 200%;
	opacity: 1;
}

.dark-glass-border {
	border: 1px solid rgba(255, 255, 255, 0.1);
	box-shadow: 
		0 4px 16px rgba(0, 0, 0, 0.3),
		inset 0 1px 0 rgba(255, 255, 255, 0.05);
	background: transparent;
	transition: all 0.4s ease;
}

.dark-glass-box:hover .dark-glass-border {
	border-color: rgba(59, 130, 246, 0.4);
	box-shadow: 
		0 8px 32px rgba(59, 130, 246, 0.15),
		inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.dark-glass-title {
	color: #ffffff;
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
	transition: all 0.3s ease;
}

.dark-glass-box:hover .dark-glass-title {
	color: #ffffff;
	text-shadow: 0 2px 12px rgba(59, 130, 246, 0.4);
}

.dark-glass-text {
	color: rgba(209, 213, 219, 0.9);
	transition: all 0.3s ease;
}

.dark-glass-box:hover .dark-glass-text {
	color: rgba(229, 231, 235, 1);
}

/* Testimonial Cards Enhanced Styles */
.testimonial-card {
	transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
	position: relative;
}

.testimonial-card:hover {
	transform: translateY(-6px);
}

.testimonial-card .glass-ai-card {
	height: 100%;
	display: flex;
	flex-direction: column;
}

.testimonial-card:hover .glass-ai-glow {
	opacity: 0.8;
	animation-duration: 2s;
}

/* Animated gradient border on hover */
.testimonial-card::after {
	content: '';
	position: absolute;
	inset: -2px;
	border-radius: 24px;
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);
	background-size: 200% 200%;
	opacity: 0;
	transition: opacity 0.4s ease;
	z-index: -1;
	animation: buttonGradientShift 3s ease infinite;
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask-composite: exclude;
	padding: 2px;
}

.testimonial-card:hover::after {
	opacity: 1;
}

/* Avatar gradient animation */
.testimonial-card:hover .w-12.h-12.rounded-full.bg-gradient-to-br {
	animation: avatarGradientShift 3s ease infinite;
	background-size: 200% 200%;
}

@keyframes avatarGradientShift {
	0%, 100% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
}

/* Star rating animation on hover */
.testimonial-card:hover .flex.items-center.gap-1 svg {
	animation: starPulse 0.6s ease;
	animation-fill-mode: both;
}

.testimonial-card:hover .flex.items-center.gap-1 svg:nth-child(1) {
	animation-delay: 0s;
}

.testimonial-card:hover .flex.items-center.gap-1 svg:nth-child(2) {
	animation-delay: 0.1s;
}

.testimonial-card:hover .flex.items-center.gap-1 svg:nth-child(3) {
	animation-delay: 0.2s;
}

.testimonial-card:hover .flex.items-center.gap-1 svg:nth-child(4) {
	animation-delay: 0.3s;
}

.testimonial-card:hover .flex.items-center.gap-1 svg:nth-child(5) {
	animation-delay: 0.4s;
}

@keyframes starPulse {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(1.2) rotate(5deg);
	}
	100% {
		transform: scale(1);
	}
}

/* Quote icon animation */
.testimonial-card:hover .absolute.top-6.right-6 svg {
	animation: quoteFloat 2s ease-in-out infinite;
}

@keyframes quoteFloat {
	0%, 100% {
		transform: translateY(0) rotate(0deg);
	}
	50% {
		transform: translateY(-5px) rotate(5deg);
	}
}

/* Author name gradient on hover */
.testimonial-card:hover .glass-ai-title {
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 50%, #06b6d4 100%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	background-clip: text;
	background-size: 200% 200%;
	animation: gradientShift 3s ease infinite;
}

/* Online status indicator pulse */
.testimonial-card:hover .bg-green-500 {
	animation: statusPulse 2s ease-in-out infinite;
	box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
}

@keyframes statusPulse {
	0% {
		box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
	}
	70% {
		box-shadow: 0 0 0 8px rgba(34, 197, 94, 0);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
	}
}

/* AI Cursor Effects - Media queries moved to responsive.css */

.ai-cursor {
	position: fixed;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.8), rgba(139, 92, 246, 0.6), transparent);
	pointer-events: none;
	z-index: 10000;
	transform: translate(-50%, -50%);
	mix-blend-mode: difference;
	transition: width 0.2s ease, height 0.2s ease;
	box-shadow: 0 0 20px rgba(59, 130, 246, 0.6),
	            0 0 40px rgba(139, 92, 246, 0.4);
}

.ai-cursor-follower {
	position: fixed;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 2px solid rgba(59, 130, 246, 0.4);
	pointer-events: none;
	z-index: 9999;
	transform: translate(-50%, -50%);
	transition: width 0.3s ease, height 0.3s ease, border-color 0.3s ease;
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.3);
}

.ai-cursor-trail {
	position: fixed;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.8), transparent);
	pointer-events: none;
	z-index: 9998;
	transform: translate(-50%, -50%);
	animation: cursorTrailFade 0.5s ease-out forwards;
}

.ai-cursor.hover {
	width: 30px;
	height: 30px;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.9), rgba(6, 182, 212, 0.7), transparent);
	box-shadow: 0 0 30px rgba(139, 92, 246, 0.8),
	            0 0 60px rgba(6, 182, 212, 0.6);
}

.ai-cursor-follower.hover {
	width: 60px;
	height: 60px;
	border-color: rgba(139, 92, 246, 0.6);
	border-width: 3px;
	box-shadow: 0 0 20px rgba(139, 92, 246, 0.5);
}

.ai-cursor.click {
	width: 15px;
	height: 15px;
	background: radial-gradient(circle, rgba(6, 182, 212, 1), rgba(59, 130, 246, 0.8), transparent);
	box-shadow: 0 0 40px rgba(6, 182, 212, 1),
	            0 0 80px rgba(59, 130, 246, 0.8);
}

.ai-cursor-follower.click {
	width: 80px;
	height: 80px;
	border-color: rgba(6, 182, 212, 0.8);
	border-width: 4px;
	box-shadow: 0 0 30px rgba(6, 182, 212, 0.7);
}

@keyframes cursorTrailFade {
	0% {
		opacity: 0.8;
		transform: translate(-50%, -50%) scale(1);
	}
	100% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(0.3);
	}
}

/* Cursor particle burst */
.ai-cursor-particle {
	position: fixed;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.9), rgba(139, 92, 246, 0.7));
	pointer-events: none;
	z-index: 9997;
	transform: translate(-50%, -50%);
	animation: cursorParticleBurst 0.6s ease-out forwards;
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.8);
}

@keyframes cursorParticleBurst {
	0% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1) rotate(0deg);
	}
	100% {
		opacity: 0;
		transform: translate(var(--x), var(--y)) scale(0) rotate(360deg);
	}
}

/* Interactive elements hover effect - Media queries moved to responsive.css */

/* AI Background Animation Styles */
.ai-bg-animation {
	position: relative;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(ellipse at top, rgba(59, 130, 246, 0.03) 0%, transparent 50%),
	            radial-gradient(ellipse at bottom, rgba(139, 92, 246, 0.03) 0%, transparent 50%);
}

/* Animated Grid Pattern */
.ai-grid-pattern {
	position: absolute;
	inset: 0;
	background-image: 
		linear-gradient(rgba(59, 130, 246, 0.1) 1px, transparent 1px),
		linear-gradient(90deg, rgba(59, 130, 246, 0.1) 1px, transparent 1px);
	background-size: 50px 50px;
	opacity: 0.3;
	animation: gridPulse 8s ease-in-out infinite;
}

@keyframes gridPulse {
	0%, 100% {
		opacity: 0.2;
		transform: scale(1);
	}
	50% {
		opacity: 0.4;
		transform: scale(1.05);
	}
}

/* Circuit Board Pattern */
.ai-circuit-pattern {
	position: absolute;
	inset: 0;
	background-image: 
		radial-gradient(circle at 20% 30%, rgba(59, 130, 246, 0.15) 1px, transparent 1px),
		radial-gradient(circle at 60% 50%, rgba(139, 92, 246, 0.15) 1px, transparent 1px),
		radial-gradient(circle at 80% 70%, rgba(6, 182, 212, 0.15) 1px, transparent 1px);
	background-size: 100px 100px, 120px 120px, 80px 80px;
	background-position: 0 0, 50px 50px, 25px 25px;
	opacity: 0.2;
	animation: circuitPulse 10s ease-in-out infinite;
}

@keyframes circuitPulse {
	0%, 100% {
		opacity: 0.15;
		transform: translate(0, 0);
	}
	50% {
		opacity: 0.25;
		transform: translate(10px, 10px);
	}
}

/* Floating Particles with Trails */
.ai-particle {
	position: absolute;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.8), rgba(139, 92, 246, 0.5), transparent);
	filter: blur(1px);
	animation: particleFloat 15s ease-in-out infinite;
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.5),
	            0 0 20px rgba(139, 92, 246, 0.3);
}

.ai-particle-trail {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 30px;
	height: 2px;
	background: linear-gradient(90deg, transparent, rgba(59, 130, 246, 0.6), transparent);
	transform: translate(-50%, -50%) rotate(45deg);
	animation: trailFade 2s ease-in-out infinite;
	opacity: 0.6;
}

@keyframes trailFade {
	0%, 100% {
		opacity: 0.3;
		transform: translate(-50%, -50%) rotate(45deg) scaleX(0.5);
	}
	50% {
		opacity: 0.8;
		transform: translate(-50%, -50%) rotate(45deg) scaleX(1.2);
	}
}

.ai-particle-1 {
	width: 8px;
	height: 8px;
	top: 20%;
	left: 10%;
	animation-delay: 0s;
	animation-duration: 12s;
}

.ai-particle-2 {
	width: 6px;
	height: 6px;
	top: 45%;
	left: 20%;
	animation-delay: 2s;
	animation-duration: 14s;
}

.ai-particle-3 {
	width: 10px;
	height: 10px;
	top: 70%;
	left: 30%;
	animation-delay: 4s;
	animation-duration: 16s;
}

.ai-particle-4 {
	width: 7px;
	height: 7px;
	top: 30%;
	left: 45%;
	animation-delay: 1s;
	animation-duration: 13s;
}

.ai-particle-5 {
	width: 9px;
	height: 9px;
	top: 60%;
	left: 55%;
	animation-delay: 3s;
	animation-duration: 15s;
}

.ai-particle-6 {
	width: 5px;
	height: 5px;
	top: 80%;
	left: 40%;
	animation-delay: 5s;
	animation-duration: 17s;
}

.ai-particle-7 {
	width: 7px;
	height: 7px;
	top: 25%;
	left: 75%;
	animation-delay: 1.5s;
	animation-duration: 13.5s;
}

.ai-particle-8 {
	width: 6px;
	height: 6px;
	top: 50%;
	left: 85%;
	animation-delay: 3.5s;
	animation-duration: 15.5s;
}

.ai-particle-9 {
	width: 8px;
	height: 8px;
	top: 65%;
	left: 90%;
	animation-delay: 2.5s;
	animation-duration: 14.5s;
}

.ai-particle-10 {
	width: 5px;
	height: 5px;
	top: 85%;
	left: 75%;
	animation-delay: 4.5s;
	animation-duration: 16.5s;
}

@keyframes particleFloat {
	0%, 100% {
		transform: translate(0, 0) scale(1);
		opacity: 0.6;
	}
	25% {
		transform: translate(30px, -40px) scale(1.2);
		opacity: 0.8;
	}
	50% {
		transform: translate(-20px, 30px) scale(0.8);
		opacity: 0.5;
	}
	75% {
		transform: translate(40px, 20px) scale(1.1);
		opacity: 0.7;
	}
}

/* Pulsing Gradient Orbs with Holographic Effect */
.ai-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(60px);
	opacity: 0.4;
	animation: orbPulse 8s ease-in-out infinite;
	box-shadow: 0 0 60px rgba(59, 130, 246, 0.3),
	            0 0 120px rgba(139, 92, 246, 0.2);
}

.ai-orb-hologram {
	position: absolute;
	inset: -20px;
	border-radius: 50%;
	background: conic-gradient(from 0deg, 
		transparent 0deg, 
		rgba(59, 130, 246, 0.2) 90deg, 
		transparent 180deg, 
		rgba(139, 92, 246, 0.2) 270deg, 
		transparent 360deg);
	animation: hologramRotate 4s linear infinite;
	opacity: 0.6;
	filter: blur(10px);
}

@keyframes hologramRotate {
	0% {
		transform: rotate(0deg);
		opacity: 0.4;
	}
	50% {
		opacity: 0.7;
	}
	100% {
		transform: rotate(360deg);
		opacity: 0.4;
	}
}

.ai-orb-1 {
	width: 200px;
	height: 200px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.5), rgba(59, 130, 246, 0.2), transparent);
	top: 10%;
	right: 10%;
	animation-delay: 0s;
	animation-duration: 10s;
}

.ai-orb-2 {
	width: 150px;
	height: 150px;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.5), rgba(139, 92, 246, 0.2), transparent);
	bottom: 20%;
	right: 25%;
	animation-delay: 2s;
	animation-duration: 12s;
}

.ai-orb-3 {
	width: 180px;
	height: 180px;
	background: radial-gradient(circle, rgba(6, 182, 212, 0.5), rgba(6, 182, 212, 0.2), transparent);
	top: 50%;
	right: 10%;
	animation-delay: 4s;
	animation-duration: 14s;
}

.ai-orb-4 {
	width: 160px;
	height: 160px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.4), rgba(59, 130, 246, 0.15), transparent);
	top: 25%;
	left: 20%;
	animation-delay: 1s;
	animation-duration: 11s;
}

.ai-orb-5 {
	width: 140px;
	height: 140px;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.4), rgba(139, 92, 246, 0.15), transparent);
	bottom: 15%;
	left: 60%;
	animation-delay: 3s;
	animation-duration: 13s;
}

@keyframes orbPulse {
	0%, 100% {
		transform: scale(1) translate(0, 0);
		opacity: 0.3;
	}
	33% {
		transform: scale(1.2) translate(20px, -20px);
		opacity: 0.5;
	}
	66% {
		transform: scale(0.9) translate(-15px, 15px);
		opacity: 0.4;
	}
}

/* Neural Network Connections */
.ai-connections {
	position: absolute;
	inset: 0;
	z-index: 1;
	opacity: 0.4;
}

.ai-connection {
	stroke: url(#connectionGradient);
	stroke-width: 2;
	opacity: 0.3;
	filter: drop-shadow(0 0 2px rgba(59, 130, 246, 0.3));
	stroke-dasharray: 5, 5;
	animation: connectionPulse 4s ease-in-out infinite, connectionFlow 3s linear infinite;
}

.ai-node {
	fill: url(#nodeGradient);
	opacity: 0.7;
	animation: nodePulse 2s ease-in-out infinite;
	filter: drop-shadow(0 0 4px rgba(59, 130, 246, 0.6));
}

.ai-node-1 { animation-delay: 0s; }
.ai-node-2 { animation-delay: 0.2s; }
.ai-node-3 { animation-delay: 0.4s; }
.ai-node-4 { animation-delay: 0.6s; }
.ai-node-5 { animation-delay: 0.8s; }
.ai-node-6 { animation-delay: 1s; }
.ai-node-7 { animation-delay: 1.2s; }
.ai-node-8 { animation-delay: 1.4s; }
.ai-node-9 { animation-delay: 1.6s; }
.ai-node-10 { animation-delay: 1.8s; }
.ai-node-11 { animation-delay: 2s; }
.ai-node-12 { animation-delay: 2.2s; }

@keyframes nodePulse {
	0%, 100% {
		r: 6;
		opacity: 0.6;
	}
	50% {
		r: 8;
		opacity: 1;
	}
}

@keyframes connectionFlow {
	0% {
		stroke-dashoffset: 0;
	}
	100% {
		stroke-dashoffset: 20;
	}
}


.ai-connection-1 {
	animation-delay: 0s;
}

.ai-connection-2 {
	animation-delay: 1s;
}

.ai-connection-3 {
	animation-delay: 2s;
}

.ai-connection-4 {
	animation-delay: 1.5s;
}

.ai-connection-5 {
	animation-delay: 0.5s;
}

.ai-connection-6 {
	animation-delay: 2.5s;
}

.ai-connection-7 {
	animation-delay: 1.8s;
}

.ai-connection-8 {
	animation-delay: 0.8s;
}

.ai-connection-9 {
	animation-delay: 2.2s;
}

@keyframes connectionPulse {
	0%, 100% {
		opacity: 0.2;
		stroke-width: 1.5;
	}
	50% {
		opacity: 0.5;
		stroke-width: 2.5;
	}
}

/* Responsive adjustments - Moved to responsive.css */

/* Data Flow Streams */
.ai-data-stream {
	position: absolute;
	width: 2px;
	height: 200px;
	background: linear-gradient(180deg, 
		transparent 0%, 
		rgba(59, 130, 246, 0.6) 20%, 
		rgba(139, 92, 246, 0.8) 50%, 
		rgba(6, 182, 212, 0.6) 80%, 
		transparent 100%);
	animation: dataStreamFlow 4s linear infinite;
	filter: blur(1px);
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
}

.ai-data-stream-1 {
	left: 15%;
	top: -200px;
	animation-delay: 0s;
	animation-duration: 4s;
}

.ai-data-stream-2 {
	left: 50%;
	top: -200px;
	animation-delay: 1.5s;
	animation-duration: 5s;
}

.ai-data-stream-3 {
	left: 85%;
	top: -200px;
	animation-delay: 3s;
	animation-duration: 4.5s;
}

@keyframes dataStreamFlow {
	0% {
		transform: translateY(0);
		opacity: 0;
	}
	10% {
		opacity: 1;
	}
	90% {
		opacity: 1;
	}
	100% {
		transform: translateY(calc(100vh + 200px));
		opacity: 0;
	}
}

/* Animated Data Packets */
.ai-data-packet {
	position: absolute;
	width: 12px;
	height: 12px;
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.9), rgba(139, 92, 246, 0.7));
	border-radius: 3px;
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.6),
	            0 0 20px rgba(139, 92, 246, 0.4);
	animation: dataPacketMove 8s linear infinite;
	transform: rotate(45deg);
}

.ai-data-packet::before {
	content: '';
	position: absolute;
	inset: 2px;
	background: rgba(255, 255, 255, 0.3);
	border-radius: 2px;
	animation: packetShine 2s ease-in-out infinite;
}

.ai-data-packet-1 {
	left: 20%;
	top: 10%;
	animation-delay: 0s;
	animation-duration: 8s;
}

.ai-data-packet-2 {
	left: 45%;
	top: 20%;
	animation-delay: 2s;
	animation-duration: 9s;
}

.ai-data-packet-3 {
	left: 70%;
	top: 15%;
	animation-delay: 4s;
	animation-duration: 7s;
}

.ai-data-packet-4 {
	left: 30%;
	top: 60%;
	animation-delay: 1s;
	animation-duration: 8.5s;
}

.ai-data-packet-5 {
	left: 75%;
	top: 70%;
	animation-delay: 3s;
	animation-duration: 9.5s;
}

@keyframes dataPacketMove {
	0% {
		transform: translate(0, 0) rotate(45deg) scale(1);
		opacity: 0.8;
	}
	25% {
		transform: translate(30px, -40px) rotate(90deg) scale(1.2);
		opacity: 1;
	}
	50% {
		transform: translate(-20px, 30px) rotate(135deg) scale(0.9);
		opacity: 0.7;
	}
	75% {
		transform: translate(40px, 20px) rotate(180deg) scale(1.1);
		opacity: 0.9;
	}
	100% {
		transform: translate(0, 0) rotate(225deg) scale(1);
		opacity: 0.8;
	}
}

@keyframes packetShine {
	0%, 100% {
		opacity: 0.2;
	}
	50% {
		opacity: 0.6;
	}
}

/* Holographic Scan Lines (Horizontal - Rotated 90deg) */
.ai-scanline {
	position: absolute;
	width: 2px;
	height: 100%;
	background: linear-gradient(180deg, 
		transparent 0%, 
		rgba(59, 130, 246, 0.4) 20%, 
		rgba(139, 92, 246, 0.6) 50%, 
		rgba(6, 182, 212, 0.4) 80%, 
		transparent 100%);
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.5),
	            0 0 20px rgba(139, 92, 246, 0.3);
	animation: scanlineMoveLeftRight 8s linear infinite;
	opacity: 0.5;
	z-index: 10;
	transform: rotate(90deg);
	transform-origin: center center;
}

.ai-scanline-top {
	top: 0%;
	left: 0;
	animation-delay: 1s;
	animation-duration: 7s;
	opacity: 0.2;
	width: 1px;
	height: 100%;
	box-shadow: 0 0 5px rgba(59, 130, 246, 0.3),
	            0 0 10px rgba(139, 92, 246, 0.2);
}

.ai-scanline-1 {
	top: 25%;
	left: 0;
	animation-delay: 0s;
	animation-duration: 8s;
	opacity: 0.6;
}

.ai-scanline-2 {
	top: 50%;
	left: 0;
	animation-delay: 2.5s;
	animation-duration: 10s;
	opacity: 0.4;
}

.ai-scanline-3 {
	top: 75%;
	left: 0;
	animation-delay: 5s;
	animation-duration: 9s;
	opacity: 0.5;
}

@keyframes scanlineMoveLeftRight {
	0% {
		left: -2px;
		opacity: 0;
	}
	5% {
		opacity: 0.8;
	}
	95% {
		opacity: 0.8;
	}
	100% {
		left: 100%;
		opacity: 0;
	}
}

/* Depth Layers */
.ai-depth-layer {
	position: absolute;
	inset: 0;
	pointer-events: none;
}

.ai-depth-layer-1 {
	background: radial-gradient(ellipse at 30% 40%, rgba(59, 130, 246, 0.05) 0%, transparent 50%);
	animation: depthLayer1 15s ease-in-out infinite;
	z-index: -1;
}

.ai-depth-layer-2 {
	background: radial-gradient(ellipse at 70% 60%, rgba(139, 92, 246, 0.05) 0%, transparent 50%);
	animation: depthLayer2 18s ease-in-out infinite;
	z-index: -2;
}

@keyframes depthLayer1 {
	0%, 100% {
		transform: translate(0, 0) scale(1);
		opacity: 0.3;
	}
	50% {
		transform: translate(30px, -30px) scale(1.1);
		opacity: 0.5;
	}
}

@keyframes depthLayer2 {
	0%, 100% {
		transform: translate(0, 0) scale(1);
		opacity: 0.3;
	}
	50% {
		transform: translate(-25px, 25px) scale(1.15);
		opacity: 0.5;
	}
}

/* Override overflow hidden for workflow sticky section - using Tailwind classes now */
/* Safari sticky support */
@supports (-webkit-appearance: none) {
	.sticky {
		position: -webkit-sticky;
	}
}

.workflow-image {
	transition: opacity 0.5s ease-in-out;
}

.workflow-image.opacity-0 {
	opacity: 0;
	pointer-events: none;
}

.workflow-image.opacity-100 {
	opacity: 1;
	pointer-events: auto;
}

/* Workflow Glass AI Card Overrides */
.workflow-content-item.glass-ai-card {
	padding: 0;
	background: rgba(255, 255, 255, 0.95);
}

.workflow-content-item.glass-ai-card.bg-gray-50 {
	background: rgba(249, 250, 251, 0.98);
}

.workflow-content-item.glass-ai-card:hover {
	background: rgba(255, 255, 255, 1);
}

/* ============================================
   Calendar Styles
   ============================================ */

.calendar-day {
	position: relative;
	padding: 0.75rem;
	text-align: center;
	border-radius: 0.5rem;
	cursor: pointer;
	transition: all 0.3s ease;
	border: 1px solid #e5e7eb;
	background: white;
}

.calendar-day:hover:not(.disabled) {
	border-color: #60a5fa;
	box-shadow: 0 10px 15px -3px rgba(59, 130, 246, 0.2), 0 4px 6px -2px rgba(59, 130, 246, 0.1);
}

.calendar-day.disabled {
	color: #d1d5db;
	cursor: not-allowed;
	opacity: 0.5;
}

.calendar-day.disabled:hover {
	border-color: #e5e7eb;
	box-shadow: none;
}

.calendar-day.today {
	border-color: #3b82f6;
	background-color: #eff6ff;
	font-weight: 600;
}

.calendar-day.selected {
	border-color: #2563eb;
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
	color: white;
	box-shadow: 0 10px 15px -3px rgba(59, 130, 246, 0.3), 0 4px 6px -2px rgba(59, 130, 246, 0.2);
	transform: scale(1.05);
	font-weight: 600;
}

.calendar-day.selected::before {
	content: '';
	position: absolute;
	inset: -2px;
	border-radius: 0.5rem;
	padding: 2px;
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.6), rgba(139, 92, 246, 0.6));
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	animation: pulse-glow 2s ease-in-out infinite;
	z-index: -1;
}

@keyframes pulse-glow {
	0%, 100% { opacity: 0.6; }
	50% { opacity: 1; }
}

.time-slot {
	position: relative;
	padding: 1rem;
	border-radius: 0.5rem;
	cursor: pointer;
	transition: all 0.3s ease;
	border: 1px solid #e5e7eb;
	background: white;
	text-align: center;
	font-weight: 500;
	color: #374151;
}

.time-slot:hover:not(.disabled) {
	border-color: #60a5fa;
	box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.2), 0 2px 4px -1px rgba(59, 130, 246, 0.1);
	background: linear-gradient(135deg, #eff6ff 0%, #faf5ff 100%);
	transform: scale(1.05);
}

.time-slot.selected {
	border-color: #2563eb;
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
	color: white;
	box-shadow: 0 10px 15px -3px rgba(59, 130, 246, 0.3), 0 4px 6px -2px rgba(59, 130, 246, 0.2);
}

.time-slot.disabled {
	opacity: 0.4;
	cursor: not-allowed;
}

.time-slot.disabled:hover {
	border-color: #e5e7eb;
	box-shadow: none;
	transform: none;
	background: white;
}

/* Modern Week Date Cards */
.week-date-card {
	min-width: 120px;
	padding: 1.25rem 1rem;
	border-radius: 0rem;
	cursor: pointer;
	transition: all 0.3s ease;
	border: 1px solid #e5e7eb;
	background: white;
	text-align: center;
	position: relative;
	overflow: hidden;
}

/* Even week styling - subtle blue tint */
.week-date-card.week-even {
	background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
	border-color: #e2e8f0;
}

/* Odd week styling - subtle purple tint */
.week-date-card.week-odd {
	background: linear-gradient(135deg, #ffffff 0%, #faf5ff 100%);
	border-color: #e9d5ff;
}

/* Override for disabled cards */
.week-date-card.week-even.disabled {
	background: #f9fafb;
	border-color: #e5e7eb;
}

.week-date-card.week-odd.disabled {
	background: #f9fafb;
	border-color: #e5e7eb;
}

/* Override for today - keep blue highlight */
.week-date-card.week-even.today {
	background: linear-gradient(135deg, #eff6ff 0%, #f0f9ff 100%);
	border-color: #3b82f6;
}

.week-date-card.week-odd.today {
	background: linear-gradient(135deg, #eff6ff 0%, #f0f9ff 100%);
	border-color: #3b82f6;
}

/* Selected state overrides week colors */
.week-date-card.week-even.selected,
.week-date-card.week-odd.selected {
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
	border-color: #2563eb;
}

.week-date-card::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.05), rgba(139, 92, 246, 0.05));
	opacity: 0;
	transition: opacity 0.3s ease;
}

.week-date-card:hover:not(.disabled)::before {
	opacity: 1;
}

.week-date-card:hover:not(.disabled) {
	border-color: #60a5fa;
	box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.2), 0 4px 6px -2px rgba(59, 130, 246, 0.1);
	transform: translateY(-2px);
}

.week-date-card.today {
	border-color: #3b82f6;
	background: linear-gradient(135deg, #eff6ff 0%, #f0f9ff 100%);
}

.week-date-card.today .week-date-number {
	color: #3b82f6;
	font-weight: 700;
}

.week-date-card.selected {
	border-color: #2563eb;
	background: linear-gradient(135deg, #3b82f6 0%, #8b5cf6 100%);
	color: white;
	box-shadow: 0 20px 25px -5px rgba(59, 130, 246, 0.3), 0 10px 10px -5px rgba(59, 130, 246, 0.2);
	transform: scale(1.05);
}

.week-date-card.selected::after {
	content: '';
	position: absolute;
	inset: -3px;
	border-radius: 1rem;
	padding: 3px;
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.6), rgba(139, 92, 246, 0.6));
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	animation: pulse-glow 2s ease-in-out infinite;
	z-index: -1;
}

.week-date-card.selected .week-date-day,
.week-date-card.selected .week-date-number,
.week-date-card.selected .week-date-month {
	color: white;
}

.week-date-card.disabled {
	opacity: 0.4;
	cursor: not-allowed;
	background: #f9fafb;
}

.week-date-card.disabled:hover {
	border-color: #e5e7eb;
	box-shadow: none;
	transform: none;
}

.week-date-day {
	font-size: 0.75rem;
	font-weight: 600;
	color: #6b7280;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	margin-bottom: 0.5rem;
}

.week-date-number {
	font-size: 1.875rem;
	font-weight: 700;
	color: #111827;
	line-height: 1;
	margin-bottom: 0.25rem;
}

.week-date-month {
	font-size: 0.875rem;
	font-weight: 500;
	color: #6b7280;
}

/* Smooth scrolling for week dates container */
#weekDatesContainer {
	scrollbar-width: thin;
	scrollbar-color: #cbd5e1 transparent;
}

#weekDatesContainer::-webkit-scrollbar {
	height: 8px;
}

#weekDatesContainer::-webkit-scrollbar-track {
	background: transparent;
}

#weekDatesContainer::-webkit-scrollbar-thumb {
	background-color: #cbd5e1;
	border-radius: 4px;
}

#weekDatesContainer::-webkit-scrollbar-thumb:hover {
	background-color: #94a3b8;
}

/* AI Empty State Styles */
.ai-empty-state {
	border-radius: 1rem;
	background: linear-gradient(135deg, rgba(249, 250, 251, 0.8) 0%, rgba(255, 255, 255, 0.9) 100%);
}

/* Floating Orbs */
.ai-empty-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(40px);
	animation: ai-orb-float 8s ease-in-out infinite;
}

.ai-empty-orb-1 {
	width: 120px;
	height: 120px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.4), transparent);
	top: 10%;
	left: 10%;
	animation-delay: 0s;
}

.ai-empty-orb-2 {
	width: 100px;
	height: 100px;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.4), transparent);
	bottom: 15%;
	right: 15%;
	animation-delay: 2s;
}

.ai-empty-orb-3 {
	width: 80px;
	height: 80px;
	background: radial-gradient(circle, rgba(6, 182, 212, 0.4), transparent);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	animation-delay: 4s;
}

@keyframes ai-orb-float {
	0%, 100% {
		transform: translate(0, 0) scale(1);
		opacity: 0.4;
	}
	33% {
		transform: translate(20px, -20px) scale(1.1);
		opacity: 0.6;
	}
	66% {
		transform: translate(-15px, 15px) scale(0.9);
		opacity: 0.5;
	}
}

/* Neural Network Animation */
.ai-empty-line-1,
.ai-empty-line-2,
.ai-empty-line-3 {
	stroke-dasharray: 5, 5;
	animation: ai-line-flow 3s linear infinite;
}

.ai-empty-line-2 {
	animation-delay: 1s;
}

.ai-empty-line-3 {
	animation-delay: 2s;
}

@keyframes ai-line-flow {
	0% {
		stroke-dashoffset: 0;
		opacity: 0.3;
	}
	50% {
		opacity: 0.8;
	}
	100% {
		stroke-dashoffset: 20;
		opacity: 0.3;
	}
}

.ai-empty-node-1,
.ai-empty-node-2,
.ai-empty-node-3,
.ai-empty-node-4 {
	animation: ai-node-pulse 2s ease-in-out infinite;
}

.ai-empty-node-1 {
	animation-delay: 0s;
}

.ai-empty-node-2 {
	animation-delay: 0.5s;
}

.ai-empty-node-3 {
	animation-delay: 1s;
}

.ai-empty-node-4 {
	animation-delay: 1.5s;
}

@keyframes ai-node-pulse {
	0%, 100% {
		r: 4;
		opacity: 0.6;
	}
	50% {
		r: 6;
		opacity: 1;
	}
}

/* Calendar Icon Glow */
.ai-calendar-icon {
	animation: ai-icon-float 3s ease-in-out infinite;
}

.ai-calendar-glow {
	position: absolute;
	inset: -20px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.3), transparent 70%);
	animation: ai-glow-pulse 2s ease-in-out infinite;
	z-index: 0;
}

@keyframes ai-icon-float {
	0%, 100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(-10px);
	}
}

@keyframes ai-glow-pulse {
	0%, 100% {
		opacity: 0.3;
		transform: scale(1);
	}
	50% {
		opacity: 0.6;
		transform: scale(1.1);
	}
}

/* Floating Particles */
.ai-empty-particle {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: linear-gradient(135deg, #3b82f6, #8b5cf6);
	animation: ai-particle-float 2s ease-in-out infinite;
	box-shadow: 0 0 10px rgba(59, 130, 246, 0.5);
}

.ai-empty-particle:nth-child(1) {
	animation-delay: 0s;
}

.ai-empty-particle:nth-child(2) {
	animation-delay: 0.7s;
}

.ai-empty-particle:nth-child(3) {
	animation-delay: 1.4s;
}

@keyframes ai-particle-float {
	0%, 100% {
		transform: translateY(0) scale(1);
		opacity: 0.7;
	}
	50% {
		transform: translateY(-15px) scale(1.2);
		opacity: 1;
	}
}

/* ============================================
   Light AI Animations for Inner Pages
   ============================================ */

/* Light Background Container */
.ai-bg-light {
	opacity: 1;
}

/* Light Grid Pattern - Box-like grid */
.ai-grid-light {
	opacity: 0.4;
	background-size: 50px 50px;
	background-image: 
		linear-gradient(rgba(59, 130, 246, 0.15) 1px, transparent 1px),
		linear-gradient(90deg, rgba(59, 130, 246, 0.15) 1px, transparent 1px);
	animation: gridPulse 8s ease-in-out infinite;
}

/* Gradient Blur Circles on Left Side */
.ai-gradient-blur-circle {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	pointer-events: none;
}

.ai-gradient-blur-1 {
	width: 300px;
	height: 300px;
	background: radial-gradient(circle, rgba(59, 130, 246, 0.4), rgba(59, 130, 246, 0.1), transparent);
	left: -100px;
	top: 10%;
	animation: ai-gradient-blur-move-1 15s ease-in-out infinite;
	animation-delay: 0s;
}

.ai-gradient-blur-2 {
	width: 250px;
	height: 250px;
	background: radial-gradient(circle, rgba(139, 92, 246, 0.35), rgba(139, 92, 246, 0.1), transparent);
	left: -80px;
	top: 50%;
	margin-top: -125px;
	animation: ai-gradient-blur-move-2 18s ease-in-out infinite;
	animation-delay: 5s;
}

.ai-gradient-blur-3 {
	width: 280px;
	height: 280px;
	background: radial-gradient(circle, rgba(6, 182, 212, 0.3), rgba(6, 182, 212, 0.08), transparent);
	left: -90px;
	bottom: 15%;
	animation: ai-gradient-blur-move-3 20s ease-in-out infinite;
	animation-delay: 10s;
}

@keyframes ai-gradient-blur-move-1 {
	0% {
		transform: translate(0, 0) scale(1);
		opacity: 0.6;
	}
	25% {
		transform: translate(400px, -60px) scale(1.15);
		opacity: 0.8;
	}
	50% {
		transform: translate(800px, 40px) scale(0.9);
		opacity: 0.7;
	}
	75% {
		transform: translate(1200px, -30px) scale(1.1);
		opacity: 0.8;
	}
	100% {
		transform: translate(1600px, 0) scale(1);
		opacity: 0.6;
	}
}

@keyframes ai-gradient-blur-move-2 {
	0% {
		transform: translate(0, 0) scale(1);
		opacity: 0.6;
	}
	25% {
		transform: translate(350px, -80px) scale(1.2);
		opacity: 0.75;
	}
	50% {
		transform: translate(750px, 50px) scale(0.85);
		opacity: 0.65;
	}
	75% {
		transform: translate(1150px, -50px) scale(1.1);
		opacity: 0.8;
	}
	100% {
		transform: translate(1600px, 0) scale(1);
		opacity: 0.6;
	}
}

@keyframes ai-gradient-blur-move-3 {
	0% {
		transform: translate(0, 0) scale(1);
		opacity: 0.6;
	}
	25% {
		transform: translate(450px, -70px) scale(1.1);
		opacity: 0.75;
	}
	50% {
		transform: translate(850px, 60px) scale(0.9);
		opacity: 0.65;
	}
	75% {
		transform: translate(1250px, -40px) scale(1.15);
		opacity: 0.8;
	}
	100% {
		transform: translate(1600px, 0) scale(1);
		opacity: 0.6;
	}
}

/* Read More Link with Arrow Hover Effect */
.read-more-link {
	transition: all 0.3s ease;
	cursor: pointer;
}

.read-more-link:hover {
	color: #3b82f6;
}

.read-more-link svg {
	opacity: 0.7;
	transition: all 0.3s ease;
}

.read-more-link:hover svg {
	opacity: 1;
	color: #3b82f6;
}

/* Navigation Dropdown Styles */
.nav-dropdown {
	position: relative;
}

.nav-submenu {
	z-index: 9998;
	transform: translateY(-10px);
	visibility: hidden;
	display: flex;
}

.nav-dropdown:hover .nav-submenu,
.nav-submenu:hover {
	display: flex !important;
	opacity: 1 !important;
	pointer-events: auto !important;
	transform: translateY(0);
	visibility: visible !important;
}

/* Rotate arrow on dropdown hover */
.nav-dropdown:hover svg {
	transform: rotate(180deg);
}

/* Mobile Menu Styles */
#mobile-menu {
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100vh;
	width: 100%;
	background-color: #fff;
	z-index: 10000;
}

.mobile-nav-submenu {
	max-height: 0;
	transition: max-height 0.3s ease-out, opacity 0.2s ease-out;
}

.mobile-nav-submenu:not(.hidden) {
	max-height: 2000px;
	opacity: 1;
}

.mobile-nav-arrow {
	transition: transform 0.2s ease-out;
}

.mobile-nav-arrow.rotate-180 {
	transform: rotate(180deg);
}

/* Ensure mobile menu is above everything */
#mobile-menu {
	z-index: 10000 !important;
}

/* Prevent body scroll when mobile menu is open */
body.mobile-menu-open {
	overflow: hidden;
}

/* Interactive Cards Hover Effect */
.interactive-cards-container {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: stretch;
	gap: 1.5rem;
	position: relative;
}

.interactive-card {
	flex: 0 1 calc(25% - 1.5rem);
	min-width: 250px;
	max-width: 300px;
	transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
	transform: scale(1);
	position: relative;
	will-change: transform;
}

.interactive-cards-container:hover .interactive-card {
	transform: scale(0.88);
	opacity: 0.65;
	filter: blur(3px) brightness(0.9);
}

.interactive-cards-container:hover .interactive-card:hover {
	transform: scale(1.18) translateY(-8px);
	opacity: 1;
	z-index: 10;
	box-shadow: 0 30px 60px rgba(0, 0, 0, 0.25), 0 0 40px rgba(59, 130, 246, 0.15);
	filter: blur(0) brightness(1.05);
}

/* Premium Card Styling */
.premium-card {
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.premium-card::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 1.5rem;
	padding: 2px;
	background: linear-gradient(135deg, rgba(59, 130, 246, 0.1), rgba(139, 92, 246, 0.1), rgba(6, 182, 212, 0.1));
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	opacity: 0;
	transition: opacity 0.5s ease;
}

.interactive-cards-container:hover .premium-card:hover::before {
	opacity: 1;
}

.premium-icon-wrapper {
	transition: transform 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.interactive-cards-container:hover .premium-card:hover .premium-icon-wrapper {
	transform: scale(1.1) rotate(5deg);
}

.premium-number-badge {
	transition: all 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.interactive-cards-container:hover .premium-card:hover .premium-number-badge {
	transform: scale(1.15) rotate(-5deg);
}

/* Gradient Animation */
@keyframes gradientShift {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}

/* Responsive adjustments */
@media (min-width: 1025px) {
	.interactive-card {
		flex: 0 1 calc(25% - 1.5rem);
	}
}

@media (max-width: 1024px) and (min-width: 641px) {
	.interactive-card {
		flex: 0 1 calc(50% - 1.5rem);
		min-width: 280px;
		max-width: 350px;
	}
	
	.interactive-cards-container:hover .interactive-card {
		transform: scale(0.9);
	}
	
	.interactive-cards-container:hover .interactive-card:hover {
		transform: scale(1.1);
	}
	.contact-page .container {
	  max-width: 90%;
	}
}

@media (max-width: 640px) {
	.interactive-card {
		flex: 0 1 100%;
		max-width: 100%;
	}
	
	.interactive-cards-container:hover .interactive-card {
		transform: scale(0.95);
		opacity: 0.8;
		filter: blur(1px);
	}
	
	.interactive-cards-container:hover .interactive-card:hover {
		transform: scale(1.05);
		opacity: 1;
		filter: blur(0);
	}
	.contact-page .container {
	  max-width: 100%;
	}
}

.contact-page .container {
  max-width: 70%;
}

/* Simple Contact Form Styles */
.contact-page form input,
.contact-page form textarea {
  transition: all 0.3s ease;
}

.contact-page form input:focus,
.contact-page form textarea:focus {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.15);
}

/* Privacy Policy Page Styles */
.privacy-section {
  scroll-margin-top: 100px;
}

.privacy-section h2 {
  transition: color 0.3s ease;
}

.privacy-section:hover h2 {
  color: #1e40af;
}

.privacy-section ul li {
  margin-bottom: 0.5rem;
}

.privacy-section a {
  transition: color 0.3s ease;
}

.privacy-section a:hover {
  color: #0891b2;
}