body {
    padding-top: 70px; /* Para acomodar a navbar fixa */
}

/* Estilo do Carrossel */
#carousel-section .carousel-item img {
    height: 500px; /* Altura fixa para o carrossel */
    object-fit: cover; /* Garante que a imagem cubra todo o espaço sem distorcer */
}
#carousel-section .carousel-caption {
    background-color: rgba(0, 0, 0, 0.5);
    padding: 20px;
    border-radius: 5px;
}

/* Estilo da Seção Sobre Nós */
#sobre-nos {
    background-color: #f8f9fa;
}

/* Estilo para a imagem na seção Sobre Nós */
#sobre-nos img {
    border: 5px solid #007bff;
    width: 100%; /* Garante que a imagem ocupe toda a largura da div */
    height: auto; /* Mantém a proporção da imagem */
    border-radius: 0 !important; /* Retangular por padrão */
}

/* Torna a imagem circular em telas maiores */
@media (min-width: 768px) {
    #sobre-nos img {
        border-radius: 50% !important;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

/* Estilo para a seção Últimos Posts (Frontend melhorado) */
.post-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.post-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1) !important;
}
.post-card .card-img-top {
    height: 200px;
    object-fit: cover;
    transition: transform 0.3s ease;
}
.post-card:hover .card-img-top {
    transform: scale(1.05);
}
.post-card .card-body a {
    text-decoration: none;
}
.post-card .card-title {
    font-weight: bold;
    font-size: 1.25rem;
}

/* Estilo para a seção de Contato (Frontend corrigido) */
#contato .card {
    border-radius: 10px;
}

#contato .social-icon {
    font-size: 2rem; /* Tamanho dos ícones */
    color: #343a40; /* Cor padrão dos ícones */
    transition: color 0.3s ease, transform 0.3s ease;
    display: inline-block;
}

#contato .social-icon:hover {
    transform: translateY(-5px); /* Efeito sutil ao passar o mouse */
}

/* Cores personalizadas no hover para cada rede social */
#contato .social-icon i.fa-facebook-f:hover {
    color: #3b5998;
}
#contato .social-icon i.fa-instagram:hover {
    color: #E1306C;
}
#contato .social-icon i.fa-tiktok:hover {
    color: #000000;
}
#contato .social-icon i.fa-whatsapp:hover {
    color: #25D366;
}
#contato .social-icon i.fa-youtube:hover {
    color: #FF0000;
}
#contato .social-icon i.fa-video:hover {
    color: #6A1B9A; /* Cor para o Kwai */
}
#contato .social-icon i.fa-linkedin-in:hover {
    color: #0077b5;
}
#contato .social-icon i.fa-twitter:hover {
    color: #1DA1F2;
}

/* Estilo para os ícones de contato */
#contato p i {
    font-size: 1.2em;
}

/* Efeitos para a seção "Sobre Nós" */
.about-image-shadow {
    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
    transition: transform 0.3s ease;
}

.about-image-shadow:hover {
    transform: translateY(-5px); /* Efeito de "levitação" ao passar o mouse */
}

/* Ajustes gerais de tipografia */
h2 {
    font-weight: 700;
}

p {
    line-height: 1.7;
}

/* Ajuste de espaçamento para telas menores */
@media (max-width: 767.98px) {
    .card-body.p-md-5 {
        padding: 2rem !important;
    }
}

/* Seção Newsletter (Visual Moderno) */
#newsletter-section {
    background: #f0f2f5; /* Fundo cinza suave para destacar a seção */
    padding: 6rem 0; /* Mais espaçamento para um visual clean */
}

.newsletter-card {
    background: #ffffff;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

.newsletter-card:hover {
    transform: translateY(-5px);
}

.newsletter-form .form-control {
    border-radius: 50px; /* Borda arredondada para o campo de e-mail */
    padding: 15px 25px;
    border: 1px solid #ced4da;
}

.newsletter-form .btn {
    border-radius: 50px; /* Borda arredondada para o botão */
    padding: 15px 30px;
    font-weight: bold;
    background: linear-gradient(45deg, #007bff, #0056b3); /* Fundo com gradiente */
    border: none;
    transition: all 0.3s ease;
}

.newsletter-form .btn:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
    transform: translateY(-2px);
}

/* Responsividade do formulário */
@media (min-width: 768px) {
    .newsletter-form {
        display: flex;
        gap: 15px; /* Espaçamento entre o input e o botão */
    }
    .newsletter-form .form-group {
        flex-grow: 1;
    }
}
/* alterar o background da atividade para diferenciar dos conteúdos */
/* Adicione esta nova regra CSS ao seu arquivo de estilos */
.atividade-card {
    background-color: #f0f8ff; /* Um tom de azul bem claro como exemplo */
    /* Você pode ajustar a cor conforme desejar. */
    /* Exemplo: background-color: #e6f7ff; (um azul mais claro) */
}

/* Estilo do Rodapé */
footer {
    background-color: #343a40 !important;
    color: #fff;
}

.about-logo-shadow {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 10px; /* Opcional: para deixar a logo com cantos arredondados */

/* Estilo para a Seção Sobre Nós */
#sobre-nos {
    background-color: #f8f9fa;
}
#sobre-nos img {
    border: 5px solid #007bff;
}

/* Estilo para o ícone de expandir/recolher */
#aboutAccordion .btn-link {
    color: #000;
    text-decoration: none;
    font-weight: bold;
    /* Linha removida */
    padding: 1.25rem 0;
    transition: color 0.3s ease;
}

#aboutAccordion .btn-link:hover {
    color: #007bff;
    text-decoration: none;
}

#aboutAccordion .btn-link .fas {
    transition: transform 0.3s ease-in-out;
}

/* Quando o botão NÃO está colapsado (ou seja, está expandido), gira o ícone */
#aboutAccordion .btn-link:not(.collapsed) .fas {
    transform: rotate(45deg);
}

/* Estilo para o ícone '+' se o botão estiver colapsado */
#aboutAccordion .btn-link.collapsed .fas.fa-plus::before {
    content: "\f067"; /* Código do ícone '+' */
}

/* Estilo para o ícone '-' se o botão estiver expandido */
#aboutAccordion .btn-link:not(.collapsed) .fas.fa-plus::before {
    content: "\f068"; /* Código do ícone '-' */
}

/* Estilo para a Seção Sobre Nós */
#sobre-nos {
    background-color: #f8f9fa;
}
#sobre-nos img {
    border: 5px solid #007bff;
}

/* Estilo para o botão do acordeão */
#aboutAccordion .btn-link {
    color: #000;
    text-decoration: none;
    font-weight: bold;
    border-bottom: 1px solid #dee2e6;
    padding: 1.25rem 0;
    transition: color 0.3s ease;
}

#aboutAccordion .btn-link:hover {
    color: #007bff;
    text-decoration: none;
}

/* Estilo do ícone */
#aboutAccordion .btn-link .toggle-icon::before {
    content: '+';
    font-weight: bold;
    font-size: 1.5rem;
    line-height: 1;
    transition: transform 0.3s ease-in-out;
    display: inline-block;
}

/* Quando o botão NÃO está colapsado, muda o ícone para '-' */
#aboutAccordion .btn-link:not(.collapsed) .toggle-icon::before {
    content: '-';
    transform: rotate(0deg); /* Mantém a rotação em 0 para o '-' */
}
}
/* Correção definitiva para remover o traço dos botões do acordeão */
#aboutAccordion .card .card-header {
    border-bottom: none !important;
    box-shadow: none !important;
}

#aboutAccordion .btn-link {
    /* Mantenha o restante dos estilos do botão aqui */
    color: #000;
    text-decoration: none;
    font-weight: bold;
    padding: 1.25rem 0;
    transition: color 0.3s ease;
}

#aboutAccordion .btn-link:hover {
    color: #007bff;
    text-decoration: none;
}