/* Cores */
:root {
    --cinza-escuro: #343a40;
    --cinza-claro: #ececec;
    --branco: #ffffff;
    --preto: #000000;
    --azul-primario: #0056b3; /* Cor primária para botões, ícones etc. (Um azul mais vibrante) */
    --azul-escuro-borda: #003366; /* Azul escuro para bordas */
    --azul-texto-claro: #1A3464; /* Tom de azul para o texto do hero - MANTIDO PARA OUTRAS SEÇÕES */
    --fundo-section-light: #f8f9fa; /* Um cinza muito claro para seções de fundo claro */

    /* Novo tom de azul para o overlay no hero - Usando o mesmo tom do background principal */
    --azul-fundo-principal: #0F1D38; /* Azul Royal mais escuro para o fundo do HERO E NAV */
    --azul-claro-site: #E0EBF5; /* Tom de azul CLARO para o fundo das páginas internas */

    --sombra-box: 0 4px 15px rgba(0, 0, 0, 0.1); /* Sombra mais suave para caixas */
    --sombra-box-hover: 0 8px 25px rgba(0, 0, 0, 0.2); /* Sombra mais intensa no hover */
    --sombra-box-hover-mais: 0 12px 30px rgba(0, 0, 0, 0.3); /* Sombra ainda mais intensa para dinamismo */
}

body {
    font-family: 'PT Sans', sans-serif;
    color: var(--branco); /* ALTERADO: Cor do texto padrão para branco */
    background-color: var(--azul-fundo-principal); /* ALTERADO: Fundo principal do body para azul escuro */
    background-attachment: fixed;
    padding-top: 0 !important;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* MUITO IMPORTANTE: FORÇA O FUNDO AZUL CLARO NO BODY DESSAS PÁGINAS (PARA MANTER AS PAGINAS INTERNAS MAIS CLARAS) */
body.sobrenos-page,
body.equipe-page,
body.areas-atuacao-page,
body.contact-page {
    background-color: var(--azul-claro-site) !important;
    background-image: none !important;
    color: var(--preto); /* Garante que o texto seja preto nessas páginas claras */
}

.navbar.fixed-top + .home-section {
    padding-top: 157px; /* Mantido para 157px para outras seções que vêm logo após a navbar */
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Gotham', sans-serif;
    color: var(--branco); /* ALTERADO: Títulos padrão para branco */
}

.lead {
    font-family: 'PT Sans', sans-serif;
    color: var(--branco); /* ALTERADO: Parágrafos lead padrão para branco */
    text-align: justify; /* ADICIONADO PARA JUSTIFICAR */
}

/* Adicionando justificação para parágrafos em geral, se não forem sobrescritos por classes específicas */
p {
    text-align: justify; /* ADICIONADO PARA JUSTIFICAR */
}

/* Barra de Navegação */
.navbar {
    background: linear-gradient(to right, rgba(15, 29, 56, 0.9), rgba(15, 29, 56, 0.7));
    padding-top: 1rem;
    padding-bottom: 1rem;
    z-index: 1030;
    width: 100%;
    position: fixed;
    top: 0;
}

.navbar-brand {
    display: flex;
    align-items: center;
}

.navbar-brand .logo-maior {
    max-height: 75px !important;
}

.navbar-brand img {
    height: 75px;
}

.navbar-nav .nav-link {
    color: var(--cinza-claro) !important;
    transition: color 0.3s ease, background-color 0.3s ease, transform 0.3s ease-in-out;
    padding: 0.5rem 1rem;
    font-size: 1.1rem;
    margin-left: 1.5rem;
    /* CHAVE PARA NÃO MUDAR DE ORDEM: Adiciona uma borda transparente para manter o espaço */
    border: 2px solid transparent;
}

.navbar-nav .nav-link:hover {
    color: var(--branco) !important;
    background-color: #495057;
    transform: translateY(-2px);
}

/* ESTILO PARA O ITEM DE NAVEGAÇÃO ATIVO (CHAVE PARA NÃO MUDAR DE ORDEM) */
.navbar-nav .nav-link.active {
    color: var(--branco) !important; /* Cor do texto quando ativo */
    background-color: var(--azul-primario); /* Fundo quando ativo */
    border-color: var(--azul-primario); /* A borda colorida vai ocupar o espaço da borda transparente */
    border-radius: 6px; /* Para que a borda e o fundo fiquem com cantos arredondados */
    transform: none; /* Garante que não haja transformação no item ativo */
}

.btn-menu {
    background-color: var(--azul-primario);
    color: var(--branco) !important;
    border: none;
    padding: 0.75rem 1.5rem;
    border-radius: 6px;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease-in-out;
}

.btn-menu:hover {
    background-color: var(--azul-escuro-borda);
    transform: translateY(-2px);
}


/* Seção de Apresentação (Hero - APENAS para index.html) */
.hero {
    min-height: 85vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    color: var(--branco);
    text-align: left;
    background-color: var(--azul-fundo-principal);
    padding-top: 100px;
    padding-bottom: 50px;
}

/* Estilo para o Hero com Imagem de Fundo */
.hero-with-image-background {
    background-image: url('../img/fundo.jpg');
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    position: relative;
}

/* Overlay para escurecer a imagem de fundo e garantir legibilidade */
.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 1;
}

.hero .container {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    height: 100%;
}

.hero-info {
    padding: 2rem;
    border-radius: 8px;
    text-align: left;
    background-color: transparent;
}

.hero-info h1.hero-title {
    font-family: 'Gotham', sans-serif;
    font-weight: 700;
    font-size: 3.2rem; /* Reduzi o tamanho da fonte para caber em duas linhas */
    color: var(--branco);
    line-height: 1.3; /* Ajustei a altura da linha para melhor espaçamento */
    margin-bottom: 1.5rem;
    padding-top: 10px;
    text-align: inherit; /* Garante que a alineação siga o pai (left) */

    /* --- ANIMAÇÃO --- */
    opacity: 0; /* Começa com opacidade 0 (invisível) */
    transform: translateY(20px); /* Começa um pouco abaixo de sua posição final */
    transition: opacity 1s ease-out, transform 1s ease-out; /* Transição suave para opacidade e posição */
}

/* Adiciona a classe 'animated' via JavaScript para iniciar a animação */
.hero-info.animated h1.hero-title {
    opacity: 1; /* Termina com opacidade 1 (visível) */
    transform: translateY(0); /* Termina em sua posição original */
}

.hero-info p.hero-description {
    font-family: 'PT Sans', sans-serif;
    font-size: 1.2rem;
    line-height: 1.6;
    color: var(--branco);
    margin-bottom: 1rem;
}

.hero-info p.hero-call-to-action {
    font-family: 'PT Sans', sans-serif;
    font-size: 1.1rem;
    line-height: 1.5;
    color: var(--branco);
    margin-bottom: 0;
}

/* NOVO: Estilo para o botão "Falar com Especialista" */
.btn-falar-especialista {
    background-color: var(--branco);
    color: var(--azul-fundo-principal);
    border: 2px solid var(--branco);
    padding: 1rem 2rem;
    border-radius: 50px;
    font-size: 1.1rem;
    font-weight: bold;
    transition: background-color 0.3s ease, color 0.3s ease, transform 0.2s ease-in-out;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-falar-especialista:hover {
    background-color: var(--azul-primario);
    color: var(--branco);
    border-color: var(--azul-primario);
    transform: translateY(-3px);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
}

.btn-falar-especialista i {
    margin-right: 0.5rem;
}


/* Home Sections base (para áreas de atuação, etc.) */
.home-section {
    padding: 3rem 0;
    margin-top: 0;
    background-color: transparent; /* Mantido transparente, pois o body já tem o fundo */
    flex-grow: 1;
}

.home-section h2 {
    font-family: 'Gotham', sans-serif;
    color: var(--branco); /* ALTERADO: Títulos para branco */
    margin-bottom: 1.5rem;
    text-align: center;
}

/* NOVO: Estilos para a seção Advogado Sócio (na página inicial) */
.advogado-socio {
    background-color: var(--branco); /* Mantido branco para contraste com o fundo azul escuro */
    padding: 4rem 0;
    box-shadow: 0 0 15px rgba(0,0,0,0.05);
}

.advogado-socio .foto-socio-home {
    width: 250px;
    height: 250px;
    object-fit: cover;
    border-radius: 50%;
    border: 5px solid var(--azul-primario);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.advogado-socio .foto-socio-home:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3);
}

.advogado-socio h2 {
    font-size: 2.2rem;
    margin-bottom: 0.5rem;
    color: var(--cinza-escuro); /* ALTERADO: Título para cinza escuro para contraste no fundo branco */
    line-height: 1.1; /* Ajustando a line-height para o novo texto */
}

.advogado-socio h2 small {
    display: block;
    font-size: 1rem; /* REDUZIDO o tamanho da fonte de "Sócio" */
    font-weight: 400;
    margin-top: 0.3rem; /* Ajustando a margem superior */
    color: var(--cinza-escuro); /* ALTERADO: Texto small para cinza escuro */
}

.advogado-socio p.lead {
    font-size: 1.1rem;
    line-height: 1.7; /* Ajustando a line-height para o novo texto */
    color: var(--cinza-escuro); /* ALTERADO: Parágrafo lead para cinza escuro */
    text-align: justify; /* Justificado */
}

/* Estilos específicos para a seção de áreas de atuação na home e na página de áreas de atuação */
.home-areas-atuacao .lead {
    text-align: center;
    margin-bottom: 2rem;
    color: var(--branco); /* ALTERADO: Parágrafo lead para branco */
}

/* ALTERAÇÃO PARA A PÁGINA AREAS-ATUACAO.HTML (texto introdutório) */
body.areas-atuacao-page .lead {
    color: var(--cinza-escuro) !important; /* Cor do texto no lead para ficar como o título */
    text-align: justify; /* Justificado */
}


.home-areas-atuacao .area-box {
    margin-bottom: 1.5rem;
    padding: 1.5rem;
    background-color: #fff; /* Mantido branco */
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.home-areas-atuacao .area-box h3 {
    color: var(--azul-texto-claro); /* Mantido o tom de azul para contraste */
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
    font-family: 'Gotham', sans-serif;
}

.home-areas-atuacao .area-box p {
    line-height: 1.6;
    color: var(--cinza-escuro); /* Mantido cinza escuro */
    text-align: justify; /* Justificado */
}

.home-areas-atuacao .area-box:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

/* Ícones para Áreas de Atuação */
.area-box .area-icon {
    font-size: 3.5rem;
    color: var(--azul-primario);
    margin-bottom: 0.5rem;
    transition: color 0.3s ease;
}

.home-areas-atuacao .area-box:hover .area-icon {
    color: var(--azul-escuro-borda);
}

/* Nova Seção: Nossos Resultados / Números */
.section-numbers {
    background-color: var(--branco); /* ALTERADO: Fundo para branco para contraste */
    padding: 4rem 0;
}

.section-numbers h2 {
    color: var(--cinza-escuro); /* ALTERADO: Título para cinza escuro */
}

.section-numbers .lead {
    color: var(--cinza-escuro); /* ALTERADO: Parágrafo lead para cinza escuro */
    text-align: center; /* Mantido centralizado */
}

.section-numbers .number-item {
    padding: 1.5rem;
    border-radius: 8px;
}

.section-numbers .number-item span {
    color: var(--azul-primario);
    font-family: 'Gotham', sans-serif;
    display: block;
    margin-bottom: 0.5rem;
}

.section-numbers .number-item p {
    color: var(--cinza-escuro); /* ALTERADO: Parágrafo para cinza escuro */
    font-family: 'PT Sans', sans-serif;
    font-size: 1.1rem;
    text-align: center; /* Mantido centralizado */
}

/* Seção Contato (Página Principal e Contato.html) */
.contato {
    padding: 3rem 0;
    background-color: var(--branco); /* ALTERADO: Fundo para branco para contraste */
    text-align: center;
    position: relative;
    z-index: 0;
}

.contato h2, .contact-page h1, .contact-page h3 {
    color: var(--preto); /* Mantido preto para contraste no fundo branco */
    font-family: 'Gotham', sans-serif;
}

.contato .lead, .contact-page .lead {
    text-align: center;
    margin-bottom: 2rem;
    color: var(--cinza-escuro); /* ALTERADO: Parágrafo lead para cinza escuro */
}

.info-contato {
    margin-bottom: 1rem;
    color: var(--cinza-escuro); /* ALTERADO: Texto info-contato para cinza escuro */
    text-align: center; /* **ADICIONADO: Força o alinhamento central para o bloco** */
}

.info-contato p { /* **NOVO: Regra específica para os parágrafos dentro de .info-contato** */
    text-align: center; /* Garante que os parágrafos dentro de info-contato não sejam justificados */
}


.info-contato a {
    color: var(--cinza-escuro); /* ALTERADO: Links info-contato para cinza escuro */
    text-decoration: none;
    transition: color 0.3s ease;
}

.info-contato a:hover {
    color: var(--azul-primario);
    text-decoration: underline;
}

.social-links {
    display: flex;
    align-items: center;
    justify-content: center;
}

.social-links span {
    margin-right: 0.5rem;
    font-family: 'Gotham', sans-serif;
    color: var(--cinza-escuro); /* Mantido cinza escuro */
}

.social-links a {
    color: var(--cinza-escuro); /* Mantido cinza escuro */
    margin: 0 0.5rem;
    font-size: 1.5rem;
    text-decoration: none;
    transition: color 0.3s ease;
}

.social-links a:hover {
    color: var(--azul-primario);
}

.map-responsive {
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    height: 0;
}

.map-responsive iframe {
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    border: none;
}

/* Estilos para o rodapé */
.rodape {
    background-color: var(--cinza-escuro);
    color: var(--cinza-claro);
    padding: 2rem 0;
    text-align: center;
    font-size: 0.9rem;
    margin-top: auto !important;
    position: relative;
    z-index: 10;
    width: 100%;
}

.rodape a {
    color: var(--cinza-claro);
    text-decoration: none;
    transition: color 0.3s ease;
}

.rodape a:hover {
    color: var(--branco);
    text-decoration: underline;
}

.rodape .container {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.rodape p {
    margin-bottom: 0.5rem;
    text-align: center; /* Garante que os parágrafos do rodapé permaneçam centralizados */
}

.rodape p:last-child {
    margin-bottom: 0;
}

/* Estilos específicos para os títulos das páginas internas */
body.equipe-page h1,
body.equipe-page h2,
body.equipe-page h3,
body.equipe-page h4,
body.areas-atuacao-page h1,
body.areas-atuacao-page h2,
body.areas-atuacao-page h3,
body.contact-page h1,
body.contact-page h2,
body.contact-page h3,
body.sobrenos-page h1,
body.sobrenos-page h2,
body.sobrenos-page h3 {
    color: var(--cinza-escuro); /* Mantido cinza escuro para páginas internas claras */
}

/* Adiciona espaço acima do título H2 na página de Áreas de Atuação e Contato */
body.areas-atuacao-page h2,
body.contact-page h2 {
    margin-top: 2rem;
}

/* Ajuste para o título principal da página Sobre Nós */
.sobrenos-main-title {
    margin-top: 5rem !important;
    margin-bottom: 4rem !important;
    font-size: 2.8rem;
}

/* Estilo para as caixas de Missão, Visão, Valores */
.info-box {
    background-color: var(--branco); /* Mantido branco */
    border-radius: 10px;
    padding: 2.5rem 1.5rem;
    box-shadow: var(--sombra-box);
    transition: all 0.3s ease-in-out;
    min-height: 250px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    text-align: center;
    border: 1px solid transparent;
}

.info-box:hover {
    transform: translateY(-10px);
    box-shadow: var(--sombra-box-hover-mais);
    border-color: var(--azul-primario);
}

.info-box h2 {
    color: var(--azul-primario); /* Mantido o tom de azul */
    margin-bottom: 1rem;
}

.info-box p.lead {
    color: var(--cinza-escuro); /* Mantido cinza escuro */
    font-size: 1rem;
    text-align: justify; /* Justificado */
}

.info-box ul.list-unstyled.lead {
    text-align: left; /* Mantido à esquerda para listas */
    width: 100%;
    padding-left: 1rem;
    color: var(--cinza-escuro); /* Mantido cinza escuro */
    font-size: 1rem;
}

.info-box ul.list-unstyled.lead li {
    margin-bottom: 0.5rem;
}

/* Estilo para o título "MAIA ADVOGADOS" na página Sobre Nós */
h2.maia-advogados-title {
    font-family: 'Gotham', sans-serif;
    font-weight: 700;
    font-size: 2.2rem;
    color: var(--azul-texto-claro); /* Esta é a cor do título */
    text-align: center;
    margin-top: 3rem;
}

/* Estilo para o fundo branco do bloco de texto principal na página Sobre Nós */
body.sobrenos-page .text-box-background {
    background-color: var(--branco); /* Fundo branco */
    padding: 2.5rem; /* Adiciona um bom espaçamento interno */
    border-radius: 10px; /* Bordas arredondadas */
    box-shadow: var(--sombra-box); /* Sombra para destacar o bloco */
    margin-bottom: 2rem; /* Espaço abaixo do bloco */
}

/* Ajusta a cor do título e do parágrafo dentro do text-box-background para preto */
body.sobrenos-page .text-box-background h2.maia-advogados-title,
body.sobrenos-page .text-box-background p.lead {
    color: var(--preto); /* Define a cor do texto para preto */
    text-align: justify; /* Justificado */
}

/* Botão de WhatsApp Fixo */
.whatsapp-button {
    position: fixed;
    width: 55px; /* Tamanho do botão (ajustado para ser visível e não intrusivo) */
    height: 55px; /* Tamanho do botão */
    bottom: 25px;
    right: 25px;
    background-color: #25d366; /* Cor verde do WhatsApp */
    color: #FFF;
    border-radius: 50%;
    text-align: center;
    font-size: 28px; /* Tamanho do ícone */
    box-shadow: 2px 2px 5px rgba(0,0,0,0.4);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: transform 0.3s ease-in-out, background-color 0.3s ease;
}

.whatsapp-button i {
    font-size: inherit; /* Garante que o ícone herde o tamanho do botão */
}

.whatsapp-button:hover {
    background-color: #1DA851; /* Tom mais escuro no hover */
    transform: scale(1.08); /* Um pequeno efeito de zoom ao passar o mouse */
    color: #FFF; /* Garante que a cor do ícone permaneça branca no hover */
}

/* --- ESTILOS ESPECÍFICOS DA PÁGINA EQUIPE --- */

.equipe-main-title {
    margin-top: 5rem !important; /* Ajusta o espaçamento do título principal da página */
    font-size: 2.8rem;
    color: var(--cinza-escuro); /* Garante a cor do título principal em páginas claras */
}

.home-equipe .lead {
    color: var(--cinza-escuro); /* Garante a cor do lead em páginas claras */
    text-align: justify; /* Justificado */
}

.membro-equipe {
    background-color: var(--branco);
    border-radius: 10px;
    padding: 1.5rem;
    text-align: center;
    box-shadow: var(--sombra-box);
    transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
    height: 100%; /* Garante que todos os cards tenham a mesma altura */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between; /* Distribui o conteúdo verticalmente */
}

.membro-equipe:hover {
    transform: translateY(-8px);
    box-shadow: var(--sombra-box-hover);
}

.foto-membro {
    width: 150px; /* Tamanho fixo da foto */
    height: 150px; /* Tamanho fixo da foto */
    border-radius: 50%; /* Torna a foto redonda */
    object-fit: cover; /* Garante que a imagem preencha o círculo sem distorção */
    border: 4px solid var(--azul-primario); /* Borda ao redor da foto */
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.nome-membro {
    font-family: 'Gotham', sans-serif;
    font-weight: 700;
    font-size: 1.4rem;
    color: var(--azul-texto-claro); /* Cor do nome */
    margin-bottom: 0.5rem;
}

.cargo-membro {
    font-family: 'PT Sans', sans-serif;
    font-size: 1rem;
    color: var(--cinza-escuro); /* Cor do cargo */
    margin-bottom: 1rem;
    flex-grow: 1; /* Permite que o cargo use o espaço disponível antes do contato */
    text-align: center; /* Mantido centralizado */
}

.contato-info {
    text-align: center;
    width: 100%; /* Ocupa a largura total do card */
    margin-top: auto; /* Empurra o contato para a parte inferior do card */
}

.contato-info p {
    font-size: 0.95rem;
    color: var(--cinza-escuro);
    margin-bottom: 0.25rem;
    font-weight: bold;
    text-align: center; /* Mantido centralizado */
}

.contato-info a {
    color: var(--azul-primario); /* Cor dos links de contato */
    text-decoration: none;
    font-size: 0.95rem;
    transition: color 0.3s ease;
    word-break: break-word; /* Ajuda a quebrar links longos */
}

.contato-info a:hover {
    color: var(--azul-escuro-borda);
    text-decoration: underline;
}

/* Responsividade para a página da equipe */
@media (max-width: 991.98px) { /* Tablet e mobile */
    .row-cols-lg-4 > * {
        flex: 0 0 auto;
        width: 50%; /* 2 colunas em telas médias */
    }
}

@media (max-width: 767.98px) { /* Mobile */
    .row-cols-md-2 > * {
        flex: 0 0 auto;
        width: 100%; /* 1 coluna em telas pequenas */
    }
}