/* Animation Keyframes */
@keyframes zoomIn {
    0% {
        transform: scale(0);
        opacity: 0;
    }

    60% {
        transform: scale(1.1);
        opacity: 1;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes spinPropeller {
    0% {
        transform: scale(0) rotate(-720deg);
        opacity: 0;
    }

    60% {
        transform: scale(1) rotate(20deg);
        opacity: 1;
    }

    80% {
        transform: scale(1) rotate(-10deg);
    }

    100% {
        transform: scale(1) rotate(0deg);
        opacity: 1;
    }
}

@keyframes fadeText {
    0% {
        opacity: 0;
        transform: translateY(10px) scale(1);
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* Center Origin relative to the 53x53 viewBox */
#bmwSvg .anim-target {
    transform-origin: 26.5px 26.5px;
}

.anim-ring {
    animation: zoomIn 0.8s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}

.anim-propeller {
    animation: spinPropeller 1s 0.2s cubic-bezier(0.25, 1, 0.5, 1) forwards;
    opacity: 0;
}

.anim-text {
    animation: fadeText 0.8s 0.8s ease-out forwards;
    opacity: 0;
}