/*
    Complemento do rodapé — só o que é novo. O resto continua no site.css.
    Inclua DEPOIS do site.css para estas regras valerem.
*/

/* Cores do tenant (variáveis injetadas no <html> pelo _Layout).
   A cor escura é escura por definição, então o texto branco mantém contraste
   em qualquer tenant. O fallback é o verde atual. */
.footer {
    background: var(--cor-primaria-escura, #0f1d16);
}

.fb-mark {
    background: var(--cor-primaria, #1f7a4a);
    color: #fff;
}

.footer-bottom {
    border-top: 1px solid rgba(255,255,255,.12);
}

/* Marca + 4 colunas. Coluna sem conteúdo não sobra mais como buraco. */
.footer-top {
    display: grid;
    grid-template-columns: minmax(240px, 1.4fr) repeat(4, minmax(140px, 1fr));
    gap: 32px;
}

/* Contraste: texto claro sobre o fundo escuro (WCAG pede 4,5:1 para texto pequeno) */
.footer-col a, .footer-col .ft-link {
    color: rgba(255,255,255,.78);
}

    .footer-col a:hover, .footer-col .ft-link:hover {
        color: #fff;
    }

.footer-brand p {
    color: rgba(255,255,255,.72);
}

/* Botões que abrem modal com cara de link */
.ft-link {
    display: block;
    padding: 0;
    margin: 0;
    border: 0;
    background: none;
    cursor: pointer;
    font: inherit;
    text-align: left;
}

.footer-col > a, .footer-col > .ft-link, .footer-col > .ft-texto {
    margin-bottom: 10px;
}

.ft-texto {
    display: block;
    font-size: 13px;
    line-height: 1.5;
    color: rgba(255,255,255,.6);
}

.ft-whats {
    font-weight: 600;
}

    .ft-whats::before {
        content: "💬 ";
    }

.ft-redes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-top: 16px;
}

    .ft-redes a {
        font-size: 13px;
        color: rgba(255,255,255,.78);
        text-decoration: none;
    }

        .ft-redes a:hover {
            color: #fff;
            text-decoration: underline;
        }

/* Linha legal */
.footer-bottom {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 16px;
    flex-wrap: wrap;
    font-size: 12px;
    color: rgba(255,255,255,.6);
}

.ft-legal {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 0;
}

    .ft-legal span:not(:last-child)::after {
        content: "·";
        margin: 0 8px;
    }

.ft-credito a {
    color: rgba(255,255,255,.78);
}

@media (max-width:900px) {
    .footer-top {
        grid-template-columns: 1fr 1fr;
    }

    .footer-brand {
        grid-column: 1 / -1;
    }
}

@media (max-width:480px) {
    .footer-top {
        grid-template-columns: 1fr;
    }
}