body {
    margin: 0;
    padding: 0;
    /* Fundo gradiente: azul marinho escuro (#0A0A2A) para preto (#000000) */
    background: linear-gradient(to bottom, #0A0A2A, #000000);
    min-height: 100vh; /* Garante que o corpo ocupe toda a altura da viewport */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: Arial, sans-serif;
    color: white;
}

.content-container {
    flex-grow: 1; /* Permite que o container principal ocupe o espaço restante */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.logo {
    max-width: 80%; /* Garante que a logo não ultrapasse 80% da largura do container */
    height: auto; /* Mantém a proporção da imagem */
    /* Limita o tamanho máximo da logo em telas maiores para não ficar exagerada */
    max-height: 40vh; /* Limita a altura máxima a 40% da altura da viewport */
}

footer {
    width: 100%;
    padding: 10px 0;
    text-align: center;
    font-size: 0.8em;
    color: rgba(255, 255, 255, 0.7); /* Cor mais suave para o rodapé */
    /* Garante que o rodapé fique na parte inferior da tela */
    margin-top: auto;
}

/* Media query para telas menores (mobile) - Ajuste fino, se necessário */
@media (max-width: 600px) {
    .logo {
        max-width: 90%; /* Aumenta um pouco o tamanho da logo em telas menores */
    }
}