/* Additional styles for AI Super Heroes Squad */

/* General styles */
body {
    overflow-x: hidden;
}

/* Hero section image placeholders */
.superhero-image-placeholder {
    position: relative;
    overflow: hidden;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.superhero-image-placeholder i {
    position: relative;
    z-index: 2;
    color: white;
}

.superhero-image-placeholder::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(52, 152, 219, 0.8) 0%, rgba(155, 89, 182, 0.8) 100%);
    z-index: 1;
}

.kommunikate-theme .superhero-image-placeholder::before {
    background: linear-gradient(135deg, rgba(52, 152, 219, 0.8) 0%, rgba(41, 128, 185, 0.8) 100%);
}

.salesy-theme .superhero-image-placeholder::before {
    background: linear-gradient(135deg, rgba(231, 76, 60, 0.8) 0%, rgba(192, 57, 43, 0.8) 100%);
}

.followup-theme .superhero-image-placeholder::before {
    background: linear-gradient(135deg, rgba(155, 89, 182, 0.8) 0%, rgba(142, 68, 173, 0.8) 100%);
}

/* Button hover effects */
.btn {
    transition: all 0.3s ease;
}

.btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* Card hover effects */
.card {
    transition: all 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Timeline styling */
.timeline-item:last-child {
    margin-bottom: 0;
}

/* Mobile responsiveness */
@media (max-width: 576px) {
    .superhero-title {
        font-size: 2rem;
    }
    
    .superhero-subtitle {
        font-size: 1rem;
    }
    
    .timeline-item {
        padding-left: 70px;
    }
    
    .timeline:before {
        left: 35px;
    }
    
    .timeline-number {
        width: 40px;
        height: 40px;
        font-size: 1.2rem;
    }
}

/* Vapi AI button visibility fix */
.vapi-widget {
    z-index: 9999 !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.vapi-button {
    z-index: 9999 !important;
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}