body {
    font-family: 'Poppins', sans-serif;
    /* Otimização de renderização de fontes */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}

/* Transição suave no carregamento da página */
body {
    animation: fadeIn 0.3s ease-in;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

/* Otimização de imagens */
img {
    height: auto;
    max-width: 100%;
}

/* Placeholder enquanto imagens carregam */
img[loading="lazy"] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* Animações */
@keyframes moveAndChangeColor {
    0% {
        transform: translate(0, 0);
    }
    33% {
        transform: translate(50px, -100px) scale(1.1);
    }
    66% {
        transform: translate(-50px, 100px) scale(0.9);
    }
    100% {
        transform: translate(0, 0);
    }
}

@keyframes changeColor {
    0%, 100% {
        background: #f1fea1;
    }
    33% {
        background: #cfc9f3;
    }
    66% {
        background: #daf7d2;
    }
}

/* Estilos das formas com animação */
.bg-1,
.bg-2,
.bg-3 {
    position: absolute;
    flex-shrink: 0;
    filter: blur(250px);
    z-index: -10;
    animation: moveAndChangeColor 10s infinite ease-in-out alternate;
}

/* Estilo e animação para bg-1 */
.bg-1 {
    width: 1200px;
    height: 1200px;
    border-radius: 758px;
    background: #f1fea1;
    top: -309px;
    right: 0;
    animation: moveAndChangeColor 10s infinite ease-in-out alternate, changeColor 6s infinite ease-in-out alternate;
}

/* Estilo e animação para bg-2 */
.bg-2 {
    width: 1500px;
    height: 1500px;
    border-radius: 1163px;
    background: #cfc9f3;
    left: -40px;
    top: -921px;
}

/* Estilo e animação para bg-3 */
.bg-3 {
    width: 600px;
    height: 1200px;
    border-radius: 660px;
    background: #daf7d2;
    left: -110px;
    top: 300px;
}
