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

.animate-pulse-slow {
    animation: pulse 3s infinite;
}

.gradient-text {
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(90deg, #6366f1, #8b5cf6);
}

.code-block {
    font-family: 'Fira Code', monospace;
    border-radius: 0.5rem;
    position: relative;
}

.code-block::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2.5rem;
    background-color: rgba(255, 255, 255, 0.1);
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem;
}
.feature-card:hover {
    transform: translateY(-0.5rem) rotate(0.5deg);
    box-shadow: 0 0 0 1px rgba(99, 102, 241, 0.5), 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    animation: groove 0.5s ease-in-out;
}

@keyframes groove {
    0%, 100% { transform: translateY(-0.5rem) rotate(0.5deg); }
    50% { transform: translateY(-0.5rem) rotate(-0.5deg); }
}

body {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.primary-button:hover {
    animation: pulse 1s infinite;
}

@keyframes bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

.vibe-mode {
    animation: bounce 2s infinite;
}