footer {
/* CORREÇÃO: Background preto e padding reduzido para diminuir a altura */
background-color: #0a0a0a; /* Usando a cor de fundo padrão do seu tema */
color: var(--text-light);
padding: 20px; /* Reduzido de 30px 20px para 20px em todas as direções */
border-top: 1px solid var(--border-color); /* Usando a variável de cor de borda */
}
.footer-container {
display: flex;
justify-content: space-between;
align-items: center;
max-width: 1200px;
margin: 0 auto;
flex-wrap: wrap; /* Permite quebrar linha em telas pequenas */
gap: 20px;
}
.footer-column {
flex: 1;
min-width: 280px; /* Largura mínima para cada coluna */
}
/* Coluna da Esquerda: Contatos */
.footer-contact {
text-align: left;
}
.footer-contact p {
margin: 10px 0;
font-size: 0.9em;
}
.footer-contact a {
color: var(--text-light);
text-decoration: none;
display: flex;
align-items: center;
gap: 10px;
transition: color 0.3s;
}
.footer-contact a:hover {
color: var(--primary-green);
}
/* Coluna do Centro: Logo */
.footer-logo {
text-align: center;
}
/* REGRA ATUALIZADA para o logo do rodapé */
.footer-logo img {
max-width: 90px; /* Tamanho ajustado */
height: auto;
/* A propriedade "filter" foi removida para mostrar o logo colorido */
}
/* Coluna da Direita: Redes Sociais */
.footer-social {
display: flex;
justify-content: flex-end;
gap: 15px;
}
.footer-social a {
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
background-color: rgba(255, 255, 255, 0.9);
border-radius: 8px;
text-decoration: none;
transition: transform 0.3s, background-color 0.3s;
}
.footer-social a:hover {
transform: scale(1.1);
background-color: #fff;
}
/* --- ÍCONES EM CSS PURO --- */
[class^='icon-'] {
display: inline-block;
width: 20px;
height: 20px;
background-color: #333; /* Cor dos ícones */
-webkit-mask-size: contain;
mask-size: contain;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-position: center;
}
.icon-link {
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.icon-mail {
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.icon-instagram {
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.icon-youtube {
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
.icon-twitch {
-webkit-mask-image: url('data:image/svg+xml;utf8,');
mask-image: url('data:image/svg+xml;utf8,');
}
@media (max-width: 768px) {
.footer-container {
flex-direction: column;
text-align: center;
}
.footer-column {
min-width: 100%;
}
.footer-contact,
.footer-social {
text-align: center;
justify-content: center;
}
}