.glass-panel {
            background: rgba(255, 255, 255, 0.7);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            border: 1px solid rgba(255, 255, 255, 0.4);
        }

        .hero-gradient {
            background: radial-gradient(circle at 50% 50%, rgba(79, 70, 229, 0.05) 0%, transparent 50%);
        }

        .text-gradient {
            background: linear-gradient(to right, #3525cd, #6b38d4);

            /* Standard property */
            background-clip: text;

            /* Safari/Chrome */
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;

            /* Optional for some browsers */
            color: transparent;
        }

        .floating {
            animation: floating 6s ease-in-out infinite;
        }

        @keyframes floating {
            0% {
                transform: translateY(0px);
            }

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

            100% {
                transform: translateY(0px);
            }
        }
		
	  .material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
        }

        .glass-panel {
            background: rgba(255, 255, 255, 0.7);
            backdrop-filter: blur(16px);
            border: 1px solid rgba(255, 255, 255, 0.4);
        }

        .custom-scrollbar::-webkit-scrollbar {
            width: 6px;
        }

        .custom-scrollbar::-webkit-scrollbar-track {
            background: transparent;
        }

        .custom-scrollbar::-webkit-scrollbar-thumb {
            background: #e2dfff;
            border-radius: 10px;
        }
		
	  body {
            font-family: 'Inter', sans-serif;
        }

        .glass-panel {
            background: rgba(255, 255, 255, 0.7);
            backdrop-filter: blur(16px);
            border: 1px solid rgba(255, 255, 255, 0.4);
        }

        .form-input-focus:focus {
            outline: none;
            border-color: #3525cd;
            box-shadow: 0 0 0 4px rgba(53, 37, 205, 0.1);
        }

        .step-active {
            color: #3525cd;
        }

        .step-line {
            height: 2px;
            background: #e2dfff;
        }

        .step-line-active {
            background: #3525cd;
        }	
		
		
		 .glass-card {
            background: rgba(255, 255, 255, 0.7);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.4);
            box-shadow: 0 4px 24px rgba(79, 70, 229, 0.05);
        }

        .pro-gradient-border {
            position: relative;
            background: #fff;
            background-clip: padding-box;
            border: 2px solid transparent;
        }

        .pro-gradient-border::before {
            content: '';
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            z-index: -1;
            margin: -2px;
            border-radius: inherit;
            background: linear-gradient(135deg, #4F46E5, #8455ef);
        }

        .toggle-knob {
            transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
		
		  body {
            background-color: #f8f9fa;
            font-family: 'Inter', sans-serif;
        }

        .glass-card {
            background: rgba(255, 255, 255, 0.7);
            backdrop-filter: blur(12px);
            border: 1px solid rgba(255, 255, 255, 0.4);
            box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.05);
        }

        .material-symbols-outlined {
            font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
            vertical-align: middle;
        }

        .active-step {
            box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.1);
        }
		
		
		   .confetti-canvas {
            pointer-events: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 10;
        }

        @keyframes float {
            0% {
                transform: translateY(0px);
            }

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

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

        .floating-icon {
            animation: float 4s ease-in-out infinite;
        }

        .gradient-button {
            background: linear-gradient(135deg, #4F46E5 0%, #3B82F6 100%);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .gradient-button:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(79, 70, 229, 0.3);
        }

        .gradient-button:active {
            transform: scale(0.95);
        }