@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes slideInLeft {
    from { opacity: 0; transform: translateX(-30px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight {
    from { opacity: 0; transform: translateX(30px); }
    to { opacity: 1; transform: translateX(0); }
}

@keyframes popupEnter {
    from {
        opacity: 0;
        transform: scale(0.9) translateY(-20px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}


.hero-bg {
    background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.4)), url('../images/forwalte_hero.webp');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}


.gradient-overlay {
    background: linear-gradient(135deg, rgba(220, 38, 38, 0.9) 0%, rgba(153, 27, 27, 0.9) 100%);
}

.fade-in {
    animation: fadeIn 0.3s ease-out;
}

.slide-in-left {
    animation: slideInLeft 0.6s ease-out;
}

.slide-in-right {
    animation: slideInRight 0.6s ease-out;
}


.mobile-menu-hidden {
    transform: translateX(-100%);
}

.mobile-menu-visible {
    transform: translateX(0);
}


.content-fade {
    transition: all 0.6s ease;
}


.form-input {
    transition: all 0.3s ease;
}

.form-input:focus {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
}


.popup-overlay {
    backdrop-filter: blur(5px);
}

.popup-enter {
    animation: popupEnter 0.3s ease-out;
}

.blocked-content {
    filter: blur(3px);
    pointer-events: none;
    user-select: none;
}


.card-hover {
    transition: all 0.3s ease;
}

.card-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}


.status-upcoming {
    background: linear-gradient(135deg, #10b981, #059669);
}

.status-today {
    background: linear-gradient(135deg, #f59e0b, #d97706);
}

.status-featured {
    background: linear-gradient(135deg, #dc2626, #991b1b);
}


.category-cards {
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
}

.category-table {
    background: linear-gradient(135deg, #10b981, #059669);
}

.category-wheel {
    background: linear-gradient(135deg, #f59e0b, #d97706);
}

.category-specialty {
    background: linear-gradient(135deg, #8b5cf6, #7c3aed);
}