.coming-soon {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    height: 60vh;
}

.coming-soon h1 {
    font-size: 3rem;
    color: #fff;
    margin-bottom: 20px;
}

.character-container {
    display: flex;
    justify-content: center;
    width: 100%;
    padding-top: -3%;
}

.character-container P {
    color: white;
    text-align: center;
    font-size: 32px;
    text-shadow: -1px 0 #090404, 0 1px black, 1px 0 black, 0 -1px black;
}

.character {
    width: 280px;
    /* Adicione a sombra inclinada para criar o efeito 3D */
    box-shadow: 10px 4px 8px rgba(0, 0, 0, 0.4);
    transition: transform 0.3s;
}

.character:hover {
    transform: translateY(-5px);
}

.character-background {
    padding: 10px;
}

.red-head-bg,
.nemesis-bg,
.ren-bg,
.sasha-bg,
.bunny-girl-bg,
.Blonde-bg {
    clip-path: polygon(-12% 0, 98% 0, 97% 118%, 0 96%);
}

.red-head-bg {}

.nemesis-bg {}

.Blonde-bg {}

.ren-bg {}

.sasha-bg {}

.bunny-girl-bg {}


/* Estilos para dispositivos móveis */

@media (max-width: 768px) {
    .character-container {
        flex-direction: column;
        /* align-items: center; */
    }
    .coming-soon {
        height: 100%;
    }
    .character-container P {
        color: white;
        text-align: center;
    }
    .red-head-bg,
    .nemesis-bg,
    .ren-bg,
    .sasha-bg,
    .bunny-girl-bg {
        clip-path: initial;
    }
    .character {
        width: 340px;
        /* padding: 11%; */
    }
    .Blonde-bg {
        clip-path: polygon(0 0, 118% 0, 97% 118%, 0 100%);
    }
}