/* =========================================================
   TupiTec – Estilos do Rodapé (Desktop)
   ========================================================= */

/* Esconde o rodapé por padrão */
.tupi-footer {
    display: none;
}

/* Mostra e estiliza o rodapé apenas em telas de desktop */
@media (min-width: 1024px) {
    .tupi-footer {
        display: block;
        background-color: #0f172a; /* Fundo principal azul escuro */
        color: #cbd5e1;           /* Cor de texto clara para bom contraste */
        font-size: 14px;
        line-height: 1.6;
    }

    /* --- Container Geral --- */
    .tupi-footer__container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 0 20px;
    }

    /* --- Área Principal (com as colunas) --- */
    .tupi-footer__main {
        padding: 64px 0; /* Espaçamento vertical generoso */
    }

    /* --- Grid de 4 Colunas --- */
    .tupi-footer__grid {
        display: grid;
        /* Coluna da marca (2fr), duas de navegação (1fr), contato (1.5fr) */
        grid-template-columns: 2fr 1fr 1fr 1.5fr;
        gap: 48px; /* Espaço entre as colunas */
    }

    /* --- Coluna 1: A Marca --- */
    .tupi-footer__col--brand .tupi-footer__logo img {
        display: block;
        max-width: 150px; /* Ajuste o tamanho da logo se necessário */
        height: auto;
        margin-bottom: 16px;
    }

    .tupi-footer__tagline {
        margin: 0 0 24px 0;
        color: #94a3b8; /* Tom de cinza-azulado para a descrição */
    }

    .tupi-footer__socials {
        display: flex;
        align-items: center;
        gap: 16px;
    }
    
    .tupi-footer__socials a {
        display: inline-block;
        line-height: 1; /* Alinha melhor a imagem */
    }

    /* NOVO: Estilo para os ícones das redes sociais via <img> */
    .tupi-social-icon {
        width: 36px;   /* Tamanho do ícone */
        height: 36px;
        opacity: 0.7; /* Opacidade inicial para um visual mais suave */
        transition: opacity .2s ease, transform .2s ease;
    }

    .tupi-footer__socials a:hover .tupi-social-icon {
        opacity: 1; /* Opacidade total no hover */
        transform: scale(1.1); /* Efeito de zoom sutil */
    }
    /* FIM DA ALTERAÇÃO */

    /* --- Estilos Comuns para Colunas de Navegação e Contato --- */
    .tupi-footer__title {
        font-size: 16px;
        font-weight: 700;
        color: #fff;
        margin-top: 0;
        margin-bottom: 20px;
    }

    .tupi-footer__menu {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .tupi-footer__menu li {
        margin-bottom: 12px;
    }

    .tupi-footer__menu a {
        color: #cbd5e1;
        text-decoration: none;
        transition: color .2s ease;
    }

    .tupi-footer__menu a:hover {
        color: #fff;
        text-decoration: underline;
    }

    /* --- Barra Inferior (Copyright e Legais) --- */
    .tupi-footer__bar {
        background-color: #020617; /* Tom de preto/azul ainda mais escuro para a barra */
        padding: 20px 0;
        font-size: 13px;
        color: #94a3b8;
        border-top: 1px solid #1e293b; /* Borda sutil */
    }

    .tupi-footer__bar .tupi-footer__container {
        display: flex;
        justify-content: space-between;
        align-items: center;
        text-align: left; /* Sobrescreve o text-align: center do código antigo */
    }

    .tupi-footer__copyright,
    .tupi-footer__legal {
        display: flex;
        flex-wrap: wrap; /* Garante que não quebre em telas menores */
        gap: 24px; /* Espaço entre os itens */
    }

    .tupi-footer__legal a {
        color: #94a3b8;
        text-decoration: none;
    }

    .tupi-footer__legal a:hover {
        color: #fff;
        text-decoration: underline;
    }
}