body, html {
    height: 100%;
    margin: 0;
    overflow: hidden;
}

body {
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
    background-size: 400% 400%;
    animation: gradientBG 15s ease infinite;
}

.container {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

@keyframes gradientBG {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

.container img {
    height: 40vh;
    object-fit: contain; /* Preserve aspect ratio */
    position: relative; /* For z-index */
    z-index: 1; /* Ensure image is above shadow */
}

.container::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 120vh;
    height: 120vh;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle at center, rgba(0, 0, 0, 0.74), rgba(0, 0, 0, 0) 70%);
    border-radius: 50%;
    z-index: 0;
}