/* Keyframes for single bounce animation */
:root {
    --animation-height: 85px; /* Стойността на финалната височина (за динамично задаване) */
}


@keyframes bounce-once {
    0%, 100% { transform: translateY(0); } /* Start and end at the original position */
    40% { transform: translateY(10px); } /* Faster jump upwards */
    70% { transform: translateY(0); }  /* Slower drop downwards */
}

@keyframes wobble {
    0% {
        transform: rotate(0deg);
    }
    25% {
        transform: rotate(5deg); /* Завъртане на 5 градуса */
    }
    50% {
        transform: rotate(0deg); /* Връщане в начална позиция */
    }
    75% {
        transform: rotate(-5deg); /* Завъртане на -5 градуса */
    }
    100% {
        transform: rotate(0deg); /* Обратно в начална позиция */
    }
}


@keyframes grow-line {
    from {
        width: 0;
    }
    to {
        width: 100%;
    }
}


@keyframes show-height-opacity {
    0% {
        height: 0;
        opacity: 0;
    }
    100% {
        height: 82px; /* Крайна височина */
        opacity: 1; /* Напълно видимо */
    }
}

/* анимация за съдържанието */
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(-5px); }
    to { opacity: 1; transform: translateY(0); }
}