/* Animations */

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

@keyframes slideIn {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(0);
    }
}

.grid-pattern {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(rgba(14, 165, 233, 0.1) 1px, transparent 1px),
        linear-gradient(90deg, rgba(14, 165, 233, 0.1) 1px, transparent 1px);
    background-size: 50px 50px;
    mask-image: radial-gradient(circle at center, black, transparent);
}

.gradient-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.3;
}

.orb-1 {
    width: 400px;
    height: 400px;
    background: linear-gradient(135deg, #0EA5E9, #6366F1);
    top: -200px;
    left: -200px;
}

.orb-2 {
    width: 300px;
    height: 300px;
    background: linear-gradient(135deg, #6366F1, #8B5CF6);
    bottom: -150px;
    right: -150px;
}