﻿
    @keyframes float {
        0%, 100% { transform: translateY(0) scale(1); opacity: 0.3; }
        50% { transform: translateY(-20px) scale(1.1); opacity: 0.6; }
    }
    .animate-float { animation: float 10s ease-in-out infinite; }
    .glass-card {
        background: rgba(24, 24, 27, 0.7);
        backdrop-filter: blur(16px);
        border: 1px solid rgba(255, 255, 255, 0.1);
    }
    .text-gradient {
        background: linear-gradient(to right, #8B5CF6, #6366F1, #00D4FF);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
    .neon-border:hover {
        border-color: #00D4FF;
        box-shadow: 0 0 15px rgba(0, 212, 255, 0.3);
    }
    .scroll-reveal {
        opacity: 0;
        transform: translateY(30px);
        transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .reveal-active {
        opacity: 1;
        transform: translateY(0);
    }
    .bg-grid {
        background-image: linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
                          linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
        background-size: 40px 40px;
    }
    .course-card {
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .course-card:hover {
        transform: translateY(-6px);
        border-color: rgba(139, 92, 246, 0.4);
        box-shadow: 0 8px 32px rgba(139, 92, 246, 0.15), 0 0 0 1px rgba(139, 92, 246, 0.2);
    }
    .badge-chip {
        transition: all 0.3s ease;
    }
    .badge-chip.active {
        background: rgba(139, 92, 246, 0.2);
        border-color: #8B5CF6;
        color: #F1F5F9;
    }
    .fade-in-card {
        animation: fadeIn 0.5s ease forwards;
    }
    @keyframes fadeIn {
        from { opacity: 0; transform: translateY(20px); }
        to { opacity: 1; transform: translateY(0); }
    }
    /* Hide scrollbar for path cards */
    .no-scrollbar::-webkit-scrollbar { display: none; }
    .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

