.modal-base {
    transition: opacity 0.3s ease-out;
}

/* The Content Card (The inner div) */
.modal-base .modal-content {
    transition: transform 0.3s ease-out, opacity 0.3s ease-out;
    transform: scale(0.95) translateY(10px);
}

/* Active State */
.modal-active.modal-base {
    opacity: 1;
}

.modal-active .modal-content {
    transform: scale(1) translateY(0);
    opacity: 1;
}