body { font-family: 'Inter', sans-serif; }
        .logo img{
            height: auto !important;
            width: auto !important;
            max-height: 3rem;
            max-width: min(60vw, 220px);
            object-fit: contain;
        }
        @media (min-width: 768px) {
            .logo img {
                max-height: 3.5rem;
                max-width: 260px;
            }
        }
        footer .logo img {
            max-height: 3.5rem;
            max-width: 240px;
        }
        /* Stable Card with Premium Glassmorphism */
        .perspective-container {
            perspective: 1500px;
        }
        .premium-glass-card {
            background: rgba(255, 255, 255, 0.05);
            backdrop-filter: blur(24px);
            -webkit-backdrop-filter: blur(24px);
            border: 1px solid rgba(255, 255, 255, 0.1);
            border-top: 1px solid rgba(255, 255, 255, 0.3);
            border-left: 1px solid rgba(255, 255, 255, 0.3);
            box-shadow: 
                0 30px 60px -15px rgba(0, 0, 0, 0.8),
                inset 0 0 20px rgba(255, 255, 255, 0.05);
            transform-style: preserve-3d;
            position: relative;
            overflow: visible;
        }
        
        /* Animated Background Orbs */
        .orb {
            position: absolute;
            border-radius: 50%;
            filter: blur(80px);
            opacity: 0.4;
            animation: orbFloat 10s ease-in-out infinite;
        }
        .orb-1 {
            width: 300px;
            height: 300px;
            background: linear-gradient(135deg, #3B82F6, #8B5CF6);
            top: -100px;
            right: -50px;
            animation-delay: 0s;
        }
        .orb-2 {
            width: 250px;
            height: 250px;
            background: linear-gradient(135deg, #8B5CF6, #EC4899);
            bottom: -80px;
            left: -60px;
            animation-delay: -3s;
        }
        .orb-3 {
            width: 200px;
            height: 200px;
            background: linear-gradient(135deg, #06B6D4, #3B82F6);
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            animation-delay: -6s;
            opacity: 0.3;
        }
        
        @keyframes orbFloat {
            0%, 100% { transform: translate(0, 0) scale(1); }
            33% { transform: translate(30px, -30px) scale(1.1); }
            66% { transform: translate(-20px, 20px) scale(0.9); }
        }
        
        /* Floating Particles */
        .particle {
            position: absolute;
            background: rgba(255, 255, 255, 0.5);
            border-radius: 50%;
            animation: particleFloat 15s infinite;
        }
        .particle-1 { width: 4px; height: 4px; top: 20%; left: 10%; animation-delay: 0s; }
        .particle-2 { width: 6px; height: 6px; top: 60%; left: 85%; animation-delay: -5s; }
        .particle-3 { width: 3px; height: 3px; top: 80%; left: 20%; animation-delay: -10s; }
        .particle-4 { width: 5px; height: 5px; top: 40%; left: 90%; animation-delay: -7s; }
        
        @keyframes particleFloat {
            0%, 100% { transform: translateY(0) translateX(0); opacity: 0; }
            10% { opacity: 1; }
            90% { opacity: 1; }
            100% { transform: translateY(-100px) translateX(50px); opacity: 0; }
        }
        
        /* Pulsing Ring Effect */
        .pulse-ring {
            position: absolute;
            border: 2px solid rgba(59, 130, 246, 0.3);
            border-radius: 50%;
            animation: pulseRing 3s ease-out infinite;
        }
        .pulse-ring-1 {
            width: 350px;
            height: 350px;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            animation-delay: 0s;
        }
        .pulse-ring-2 {
            width: 380px;
            height: 380px;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            animation-delay: -1.5s;
        }
        
        @keyframes pulseRing {
            0% { transform: translate(-50%, -50%) scale(0.8); opacity: 1; }
            100% { transform: translate(-50%, -50%) scale(1.3); opacity: 0; }
        }
        
        /* Glassmorphism utility for header */
        .glass {
            background: rgba(15, 23, 42, 0.7);
            backdrop-filter: blur(16px);
            -webkit-backdrop-filter: blur(16px);
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }
        
        .gradient-text {
            background: linear-gradient(135deg, #60A5FA 0%, #A78BFA 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }
        
        /* Dark theme hero gradient */
        .hero-gradient {
            background: radial-gradient(circle at top right, rgba(59, 130, 246, 0.25), transparent 40%),
                        radial-gradient(circle at bottom left, rgba(139, 92, 246, 0.25), transparent 40%);
        }
        
        /* Responsive adjustments */
        @media (max-width: 1024px) {
            .orb-1 { width: 200px; height: 200px; }
            .orb-2 { width: 180px; height: 180px; }
            .pulse-ring-1 { width: 280px; height: 280px; }
            .pulse-ring-2 { width: 310px; height: 310px; }
        }
        
        @media (max-width: 768px) {
            .orb { display: none; }
            .particle { display: none; }
            .pulse-ring { display: none; }
        }