/* ========================================= */
/* ===== SEÇÃO FOOTER E MÉTODOS DE PAGAMENTO (CSS ISOLADO) ===== */
/* ========================================= */

/* Footer profissional (seção de colunas) */
.professional-footer {
    background-color: #ffffff; /* Fundo branco */
    color: #333; /* Texto escuro */
    padding: 60px 0;
    border-top: 1px solid #eee; /* Borda superior sutil */
}

.professional-footer .container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 30px;
}

.professional-footer .footer-col {
    flex: 1;
    min-width: 200px; /* Largura mínima para colunas antes de quebrar */
}

.professional-footer .footer-col.logo-col {
    flex: 1.5; /* Coluna maior para logo e descrição */
}

.professional-footer .footer-logo {
    max-width: 150px;
    margin-bottom: 20px;
}

.professional-footer h3 {
    font-size: 20px;
    margin-bottom: 25px;
    color: var(--purple-accent); /* Cor de destaque */
}

.professional-footer ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.professional-footer ul li {
    margin-bottom: 15px;
}

.professional-footer ul li a {
    color: #555; /* Cor do link */
    text-decoration: none;
    transition: color 0.3s ease;
}

.professional-footer ul li a:hover {
    color: var(--purple-accent); /* Cor de destaque no hover */
}

.professional-footer p {
    font-size: 15px;
    line-height: 1.6;
    color: #666; /* Cor do parágrafo */
}

.professional-footer .contact-info p {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
}

.professional-footer .contact-info i {
    margin-right: 10px;
    color: var(--purple-accent); /* Cor de destaque para ícones */
}

/* Footer principal (ícones sociais e métodos de pagamento) */
.main-footer {
    background-color: #ffffff; /* Fundo branco */
    color: #333; /* Texto escuro */
    padding: 10px 0; /* Padding reduzido para aproximar */
    text-align: center;
    border-top: 0; /* Borda superior removida */
}

.main-footer .footer-bottom {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    justify-content: space-between; /* Alinha social na esquerda e pagamentos na direita */
    align-items: center; /* Centraliza verticalmente */
    flex-wrap: wrap; /* Permite quebrar em telas menores */
    gap: 15px; /* Espaço entre social e pagamentos ao quebrar */
}

.main-footer .social-icons,
.main-footer .payment-methods {
    display: flex;
    gap: 10px; /* Espaço entre ícones individuais */
    margin-bottom: 0;
    flex-wrap: wrap; /* Permite que ícones dentro do grupo quebrem */
    justify-content: center; /* Centraliza ícones dentro do seu grupo */
}

.main-footer .social-icons a {
    color: #666; /* Cor para ícones sociais */
    font-size: 20px;
    transition: color 0.3s ease;
}

.main-footer .social-icons a:hover {
    color: var(--purple-accent); /* Cor de destaque no hover */
}

/* Estilos para as imagens de métodos de pagamento */
.main-footer .payment-methods {
    justify-content: flex-end; /* Alinha as bandeiras à direita dentro do seu container */
    margin-left: auto; /* Empurra esta div para a direita dentro do footer-bottom */
}

.main-footer .payment-methods img {
    height: 28px; /* Altura padrão para as imagens */
    width: auto; /* Mantém a proporção */
    margin: 0 4px; /* Espaçamento ajustado entre as bandeiras */
    vertical-align: middle;
    /* transition: transform 0.2s ease; /* Opcional: animação ao passar o mouse */
}

/* Opcional: efeito de hover para as imagens de pagamento */
.main-footer .payment-methods img:hover {
    /* transform: scale(1.05); */
    opacity: 0.8;
}

/* Estilo para o sinal de "+" */
.main-footer .payment-methods .payment-plus {
    font-size: 28px; /* Tamanho do "+" para combinar com as imagens */
    color: #666; /* Cor similar aos ícones */
    font-weight: bold;
    margin-left: 5px; /* Espaço após a última bandeira */
    vertical-align: middle;
}

/* Esconde o parágrafo original do main-footer, se não for mais usado */
.main-footer p {
    display: none;
}

/* Seção inferior (Copyright e Política de Privacidade) */
.footer-sub-bottom {
    background-color: var(--white-color); /* Fundo branco ou similar ao footer */
    color: #555; /* Cor de texto padrão */
    padding: 10px 0; /* Padding reduzido para aproximar */
    border-top: 0; /* Borda superior removida */
}

.footer-sub-container {
    max-width: 1200px; /* Garante que o container se alinha com o resto do site */
    margin: 0 auto; /* Centraliza o container */
    padding: 0 20px; /* Padding nas laterais */
    display: flex;
    justify-content: space-between; /* Alinha copyright à esquerda e política à direita */
    align-items: center; /* Centraliza verticalmente */
    flex-wrap: wrap; /* Permite quebrar em telas menores */
    gap: 10px; /* Espaçamento quando os itens quebram */
}

.copyright-text {
    font-size: 14px;
    opacity: 0.9;
    flex-grow: 1; /* Permite que o texto do copyright cresça */
    text-align: left; /* Alinha o texto à esquerda */
}

.privacy-policy {
    font-size: 14px;
    text-align: right; /* Alinha o link da política à direita */
}

.privacy-policy .privacy-link {
    color: #555;
    text-decoration: none;
    transition: color 0.3s ease;
}

.privacy-policy .privacy-link:hover {
    color: var(--primary-color);
    text-decoration: underline;
}

/* ========================================= */
/* ===== MEDIA QUERIES ESPECÍFICAS DO FOOTER ===== */
/* ========================================= */

@media (max-width: 768px) {
    /* Ajustes para o footer profissional em telas menores */
    .professional-footer .container {
        flex-direction: column; /* Pilha as colunas verticalmente */
        text-align: center;
    }

    .professional-footer .footer-col {
        min-width: unset;
        width: 100%;
        margin-bottom: 30px; /* Espaço entre colunas empilhadas */
    }

    .professional-footer .footer-logo {
        margin-left: auto;
        margin-right: auto;
    }

    .professional-footer h3 {
        margin-bottom: 15px;
    }

    .professional-footer ul {
        display: flex; /* Faz os itens da lista ficarem lado a lado */
        flex-wrap: wrap; /* Permite quebra de linha */
        justify-content: center; /* Centraliza itens quando quebram */
        gap: 10px 20px; /* Espaçamento vertical e horizontal entre itens */
    }
    
    .professional-footer ul li {
        margin-bottom: 0; /* Remove margem vertical padrão quando flexionado */
    }

    .professional-footer .contact-info p {
        justify-content: center; /* Centraliza as informações de contato */
    }

    /* Ajustes para o main-footer (ícones sociais e pagamentos) em telas menores */
    .main-footer .footer-bottom {
        flex-direction: column; /* Pilha os ícones sociais e métodos de pagamento verticalmente */
        text-align: center;
        gap: 15px; /* Espaço entre grupos empilhados */
    }

    .main-footer .social-icons,
    .main-footer .payment-methods {
        justify-content: center; /* Centraliza ícones quando empilhados */
        width: 100%; /* Ocupa a largura total */
    }

    /* Ajustes para a seção inferior (copyright e política) em telas menores */
    .footer-sub-container {
        flex-direction: column; /* Empilha os itens verticalmente */
        text-align: center; /* Centraliza o texto */
    }
    .copyright-text,
    .privacy-policy {
        text-align: center; /* Centraliza ambos os textos */
        width: 100%; /* Ocupa a largura total */
    }
    .copyright-text {
        margin-bottom: 5px; /* Espaço entre copyright e política empilhados */
    }
}

/* FIM DA SEÇÃO FOOTER E MÉTODOS DE PAGAMENTO */