.box {
    width: 120px;
    height: 120px;
    background-color: purple;
    transition: transform 0.6s ease, box-shadow 0.6s ease, background-color 0.6s ease;
    text-align: center;
    line-height: 120px;
    color: white;
    margin: 20px;
    border-radius: 10px;
}

.box:hover {
    background-color: orange;
    transform: rotate(15deg) scale(1.2);
    box-shadow: 0px 10px 20px rgba(0,0,0,0.4);
}

/* Nova animação */
@keyframes pulseRotate {
    0% {
        transform: scale(1) rotate(0deg);
        background-color: teal;
    }
    50% {
        transform: scale(1.3) rotate(180deg);
        background-color: limegreen;
    }
    100% {
        transform: scale(1) rotate(360deg);
        background-color: teal;
    }
}

/* Caixa animada */
.animated-box {
    width: 120px;
    height: 120px;
    background-color: teal;
    animation: pulseRotate 3s infinite;
    text-align: center;
    line-height: 120px;
    color: white;
    margin: 20px;
    border-radius: 10px;
}