* {
             margin: 0;
             padding: 0;
             box-sizing: border-box;
             scroll-behavior: smooth;
         }

         body {
             background: #030712;
             overflow-x: hidden;
         }

         /* Custom Scrollbar */
         ::-webkit-scrollbar {
             width: 8px;
         }

         ::-webkit-scrollbar-track {
             background: #0a0f1a;
         }

         ::-webkit-scrollbar-thumb {
             background: linear-gradient(180deg, #f97316, #f59e0b);
             border-radius: 4px;
         }

         /* Gradient Text */
         .gradient-text {
             background: linear-gradient(135deg, #f97316, #f59e0b, #06b6d4);
             -webkit-background-clip: text;
             -webkit-text-fill-color: transparent;
             background-clip: text;
         }

         .gradient-text-blue {
             background: linear-gradient(135deg, #06b6d4, #3b82f6);
             -webkit-background-clip: text;
             -webkit-text-fill-color: transparent;
             background-clip: text;
         }

         /* Glowing Effects */
         .glow-orange {
             box-shadow: 0 0 20px rgba(249, 115, 22, 0.5),
                 0 0 40px rgba(249, 115, 22, 0.3),
                 0 0 60px rgba(249, 115, 22, 0.1);
         }

         .glow-cyan {
             box-shadow: 0 0 20px rgba(6, 182, 212, 0.5),
                 0 0 40px rgba(6, 182, 212, 0.3),
                 0 0 60px rgba(6, 182, 212, 0.1);
         }

         .text-glow {
             text-shadow: 0 0 10px rgba(249, 115, 22, 0.8),
                 0 0 20px rgba(249, 115, 22, 0.5),
                 0 0 30px rgba(249, 115, 22, 0.3);
         }

         /* Animated Background Grid */
         .grid-bg {
             background-image:
                 linear-gradient(rgba(249, 115, 22, 0.03) 1px, transparent 1px),
                 linear-gradient(90deg, rgba(249, 115, 22, 0.03) 1px, transparent 1px);
             background-size: 50px 50px;
             animation: gridMove 20s linear infinite;
         }

         @keyframes gridMove {
             0% {
                 background-position: 0 0;
             }

             100% {
                 background-position: 50px 50px;
             }
         }

         /* Particle Animation */
         .particle {
             position: absolute;
             width: 4px;
             height: 4px;
             background: #f97316;
             border-radius: 50%;
             animation: particleFloat 15s infinite;
             opacity: 0.6;
         }

         @keyframes particleFloat {

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

             10% {
                 opacity: 0.6;
             }

             90% {
                 opacity: 0.6;
             }

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

         /* Gear Rotation */
         .gear-rotate {
             animation: gearSpin 20s linear infinite;
         }

         .gear-rotate-reverse {
             animation: gearSpin 15s linear infinite reverse;
         }

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

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

         /* Pulse Animation */
         .pulse-ring {
             animation: pulseRing 2s ease-out infinite;
         }

         @keyframes pulseRing {
             0% {
                 transform: scale(1);
                 opacity: 1;
             }

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

         /* Float Animation */
         .float {
             animation: float 6s ease-in-out infinite;
         }

         @keyframes float {

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

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

         /* Slide In Animations */
         .slide-up {
             opacity: 0;
             transform: translateY(60px);
             transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
         }

         .slide-up.visible {
             opacity: 1;
             transform: translateY(0);
         }

         .slide-left {
             opacity: 0;
             transform: translateX(-60px);
             transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
         }

         .slide-left.visible {
             opacity: 1;
             transform: translateX(0);
         }

         .slide-right {
             opacity: 0;
             transform: translateX(60px);
             transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
         }

         .slide-right.visible {
             opacity: 1;
             transform: translateX(0);
         }

         .scale-in {
             opacity: 0;
             transform: scale(0.8);
             transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
         }

         .scale-in.visible {
             opacity: 1;
             transform: scale(1);
         }

         /* Card Hover Effects */
         .card-3d {
             transform-style: preserve-3d;
             transition: transform 0.5s ease;
         }

         .card-3d:hover {
             transform: translateY(-10px) rotateX(5deg) rotateY(-5deg);
         }

         /* Border Animation */
         .animated-border {
             position: relative;
             background: linear-gradient(#0a0f1a, #0a0f1a) padding-box,
                 linear-gradient(135deg, #f97316, #06b6d4, #f97316) border-box;
             border: 2px solid transparent;
             background-size: 200% 200%;
             animation: borderGradient 3s ease infinite;
         }

         @keyframes borderGradient {

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

             50% {
                 background-position: 100% 50%;
             }
         }

         /* Typing Animation */
         .typing {
             overflow: hidden;
             border-right: 3px solid #f97316;
             white-space: nowrap;
             animation: typing 3s steps(40) infinite, blink 0.7s step-end infinite;
         }

         @keyframes typing {

             0%,
             100% {
                 width: 0;
             }

             50%,
             90% {
                 width: 100%;
             }
         }

         @keyframes blink {
             50% {
                 border-color: transparent;
             }
         }

         /* Shimmer Effect */
         .shimmer {
             position: relative;
             overflow: hidden;
         }

         .shimmer::after {
             content: '';
             position: absolute;
             top: 0;
             left: -100%;
             width: 100%;
             height: 100%;
             background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
             animation: shimmer 2s infinite;
         }

         @keyframes shimmer {
             100% {
                 left: 100%;
             }
         }

         /* Magnetic Button Effect */
         .magnetic-btn {
             transition: transform 0.3s ease;
         }

         /* Counter Animation */
         .counter {
             display: inline-block;
         }

         /* Line Draw Animation */
         .line-draw {
             stroke-dasharray: 1000;
             stroke-dashoffset: 1000;
             animation: drawLine 2s ease forwards;
         }

         @keyframes drawLine {
             to {
                 stroke-dashoffset: 0;
             }
         }

         /* Hover Line Effect */
         .hover-line {
             position: relative;
         }

         .hover-line::after {
             content: '';
             position: absolute;
             bottom: -2px;
             left: 0;
             width: 0;
             height: 2px;
             background: linear-gradient(90deg, #f97316, #06b6d4);
             transition: width 0.3s ease;
         }

         .hover-line:hover::after {
             width: 100%;
         }

         /* Noise Texture */
         .noise {
             position: relative;
         }

         .noise::before {
             content: '';
             position: absolute;
             inset: 0;
             background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");
             opacity: 0.03;
             pointer-events: none;
         }

         /* Spotlight Effect */
         .spotlight {
             position: relative;
             overflow: hidden;
         }

         .spotlight::before {
             content: '';
             position: absolute;
             top: -50%;
             left: -50%;
             width: 200%;
             height: 200%;
             background: radial-gradient(circle, rgba(249, 115, 22, 0.1) 0%, transparent 50%);
             animation: spotlight 10s ease-in-out infinite;
         }

         @keyframes spotlight {

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

             25% {
                 transform: translate(20%, 20%);
             }

             50% {
                 transform: translate(0, 40%);
             }

             75% {
                 transform: translate(-20%, 20%);
             }
         }

         /* Hexagon Pattern */
         .hex-pattern {
             background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='49' viewBox='0 0 28 49'%3E%3Cg fill-rule='evenodd'%3E%3Cg fill='%23f97316' fill-opacity='0.03'%3E%3Cpath d='M13.99 9.25l13 7.5v15l-13 7.5L1 31.75v-15l12.99-7.5zM3 17.9v12.7l10.99 6.34 11-6.35V17.9l-11-6.34L3 17.9zM0 15l12.98-7.5V0h-2v6.35L0 12.69v2.3zm0 18.5L12.98 41v8h-2v-6.85L0 35.81v-2.3zM15 0v7.5L27.99 15H28v-2.31h-.01L17 6.35V0h-2zm0 49v-8l12.99-7.5H28v2.31h-.01L17 42.15V49h-2z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
         }

         /* Morphing Shape */
         .morph {
             animation: morph 8s ease-in-out infinite;
         }

         @keyframes morph {

             0%,
             100% {
                 border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
             }

             50% {
                 border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%;
             }
         }

         /* Scanner Line */
         .scanner {
             position: relative;
             overflow: hidden;
         }

         .scanner::after {
             content: '';
             position: absolute;
             top: 0;
             left: 0;
             right: 0;
             height: 2px;
             background: linear-gradient(90deg, transparent, #06b6d4, transparent);
             animation: scan 3s linear infinite;
         }

         @keyframes scan {
             0% {
                 top: 0;
                 opacity: 1;
             }

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

         /* Stagger Animation Delays */
         .stagger-1 {
             transition-delay: 0.1s;
         }

         .stagger-2 {
             transition-delay: 0.2s;
         }

         .stagger-3 {
             transition-delay: 0.3s;
         }

         .stagger-4 {
             transition-delay: 0.4s;
         }

         .stagger-5 {
             transition-delay: 0.5s;
         }

         .stagger-6 {
             transition-delay: 0.6s;
         }

         /* Disable moving part animations on mobile devices for better performance */
         /* Particle and typing animations are kept enabled on mobile */
         @media (max-width: 767px) {

             /* Disable gear rotation */
             .gear-rotate,
             .gear-rotate-reverse {
                 animation: none;
             }

             /* Disable pulse ring animation */
             .pulse-ring {
                 animation: none;
                 opacity: 0;
             }

             /* Disable float animation */
             .float {
                 animation: none;
             }

             /* Disable morph animation */
             .morph {
                 animation: none;
                 border-radius: 50%;
             }

             /* Disable scanner animation */
             .scanner::after {
                 animation: none;
                 display: none;
             }

             /* Disable shimmer effect */
             .shimmer::after {
                 animation: none;
                 display: none;
             }

             /* Disable grid background animation */
             .grid-bg {
                 animation: none;
             }

             /* Disable spotlight animation */
             .spotlight::before {
                 animation: none;
             }

             /* Disable border gradient animation */
             .animated-border {
                 animation: none;
             }

             /* Disable Tailwind animate-pulse */
             .animate-pulse {
                 animation: none;
             }

             /* Disable Tailwind animate-spin */
             .animate-spin {
                 animation: none;
             }

             /* Disable Tailwind animate-bounce */
             .animate-bounce {
                 animation: none;
             }
         }