body {
    font-family: "EB Garamond", serif;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #1f3b52;
    color: #fff;
}

/* INÍCIO DA HEADER */

/* Header Principal */
/* Header Principal */
/* Header Principal */
/* Header Principal */
header {
    background-color: #16232b;
    width: 100%;
    height: 100px;
    display: flex;
    justify-content: center;
}

.container-header {
    width: 100%;
    max-width: 1200px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
}

/* Estilização do Logo */
.logo {
    width: 150px;
    height: 50px;
    background-image: url('https://thiagogoedert.adv.br/path/to/Logo-GV---2.svg');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
}

/* Botão do WhatsApp na Header */
.btn-whatsapp-header {
    display: inline-block;
    padding: 10px 20px;              /* Espaçamento interno */
    font-size: 16px;                 /* Tamanho da fonte */
    font-family: 'Arial', sans-serif; /* Fonte específica */
    text-align: center;              /* Centralizar texto */
    background-color: #25D366;       /* Cor de fundo */
    color: white;                    /* Cor do texto */
    border: none;                    /* Sem bordas */
    border-radius: 5px;              /* Bordas arredondadas */
    text-decoration: none;           /* Remove sublinhado */
}

/* Estilo de Hover para o Botão */
.btn-whatsapp-header:hover {
    background-color: #075E54; /* Cor de fundo ao passar o mouse */
}

/* FIM DA HEADER */

main {
    display: flex;
    flex: 1;
    justify-content: space-between;
    align-items: center; /* Alinha verticalmente ao centro */
    padding: 0;
    background-image: url('https://thiagogoedert.adv.br/imagens/bgThiago.jpg');
    background-size: cover; /* Faz com que a imagem cubra todo o espaço disponível no <main> */
    background-position: center; /* Centraliza a imagem no <main> */
    background-repeat: no-repeat; /* Impede que a imagem se repita */
    min-height: 100vh; /* Garante que o <main> ocupe pelo menos a altura da tela */
}

.hero {
    display: flex;
    flex: 1;
    justify-content: space-between;
    align-items: stretch; /* Alinha os itens para que estiquem verticalmente */
    padding: 0;
}

.hero .content {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end; /* Alinha a imagem no final da área */
    text-align: center;
    margin-top: 0;
    margin-bottom: 0; /* Remover qualquer margem inferior */
}

.hero .content .profile-picture {
    width: 100%;
    max-width: 400px;
    height: auto;
    border-radius: 10px;
    object-fit: cover;
    margin-bottom: 0; /* Remover qualquer margem inferior */
}

.contact-form {
    flex: 1;
    display: flex;
    flex-direction: column; /* Alinha os itens verticalmente */
    justify-content: center; /* Centraliza verticalmente */
    align-items: center;
    background-color: #f8f8f8;
    padding: 20px;
    border-radius: 10px;
    color: #333;
    margin: 20px 20px; /* Adiciona margem superior e inferior */
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.contact-form form {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.contact-form label {
    margin: 10px 0 5px;
}

.contact-form input, .contact-form textarea {
    padding: 10px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

.contact-form button, .whatsapp-button {
    padding: 10px 20px;
    border: none;
    background-color: #16232b;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
    font-family: Arial, sans-serif;
}

.contact-form button:hover, .whatsapp-button:hover {
    background-color: #1f3b52;
}

.whatsapp-button {
    background-color: #25D366;
    text-align: center;
    margin-top: 10px;
    text-decoration: none;
}

.whatsapp-button:hover {
    background-color: #1ebd50;
}

.team {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px 20px;
    background-color: #f0f0f0;
    color: #333;
    line-height: 0.5;
}

.team-member {
    text-align: center;
    margin: 0 20px;
}

.circle-photo {
    width: 150px;
    height: 150px;
    border-radius: 50%;
    overflow: hidden;
    margin-bottom: 10px;
}

.circle-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/*INÍCIO DE SERVIÇOS*/
.services {
    background-color: #162733; /* Fundo claro e suave */
    padding: 60px 20px; /* Mantive o padding geral da seção */
    text-align: center;
}

.services .container {
    max-width: 1200px;
    margin: 0 auto;
}

.services h2 {
    font-family: 'EB Garamond', serif;
    font-size: 2.5rem;
    color: #EFECED;
    margin-top: 0px; /* Ajuste o espaçamento em cima do título aqui */
    margin-bottom: 20px; /* Espaçamento abaixo do título */
    font-weight: 600;
    letter-spacing: -0.5px; /* Ajuste fino no espaçamento das letras */
}

.services p {
    font-family: 'Arial', sans-serif; /* Fonte sans-serif para o texto */
    font-size: 1.2rem;
    color: #555;
    margin-bottom: 40px;
    line-height: 1.6; /* Espaçamento entre linhas maior */
}

.service-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 30px; /* Espaçamento maior entre os itens */
}

.service-item {
    background-color: #fff;
    border-radius: 12px; /* Bordas mais arredondadas */
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08); /* Sombra mais suave */
    padding: 30px;
    flex: 1 1 calc(25% - 30px); /* 4 colunas em telas maiores */
    text-align: center;
    box-sizing: border-box; /* Garante que o padding não ultrapasse a largura */
}

.service-item .icon {
    font-size: 2rem;
    margin-bottom: 15px;
    color: #1f3b52; /* Cor do ícone */
}

.service-item h3 {
    font-family: 'EB Garamond', serif;
    font-size: 1.5rem;
    color: #1f3b52;
    margin-bottom: 15px;
    font-weight: 600;
}

.service-item p {
    font-family: 'Arial', sans-serif; /* Fonte sans-serif para o texto */
    font-size: 1rem;
    color: #555;
    line-height: 1.6; /* Espaçamento entre linhas maior */
}

/* Responsividade */
@media (max-width: 768px) {
    .service-item {
        flex: 1 1 calc(50% - 20px); /* 2 colunas em telas menores */
    }
}

@media (max-width: 480px) {
    .service-item {
        flex: 1 1 100%; /* 1 coluna em telas muito pequenas */
    }

    .services h2 {
        font-size: 2rem;
    }

    .services p {
        font-size: 1rem;
    }

    .service-item h3 {
        font-size: 1.25rem;
    }

    .service-item p {
        font-size: 0.9rem;
    }

    .whatsapp-button {
        font-size: 16px;
        padding: 10px 20px;
    }
}

/* Responsividade */
@media (max-width: 768px) {
    .service-item {
        flex: 1 1 calc(50% - 20px); /* 2 colunas em telas menores */
    }
}

@media (max-width: 480px) {
    .service-item {
        flex: 1 1 100%; /* 1 coluna em telas muito pequenas */
    }

    .services h2 {
        font-size: 2rem;
    }

    .services p {
        font-size: 1rem;
    }

    .service-item h3 {
        font-size: 1.25rem;
    }

    .service-item p {
        font-size: 0.9rem;
    }

    .whatsapp-button {
        font-size: 16px;
        padding: 10px 20px;
    }
}

/*INÍCIO DO FOOTER*/

footer {
    display: flex;
    flex-wrap: wrap; /* Permite que os elementos "quebrem" linha */
    justify-content: space-between;
    padding: 20px;
    background-color: #16232b;
    line-height: 0.9; /* Reduz o espaçamento entre as linhas */
    color: #fff;
}

.footer-left, .footer-right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%; /* Padrão para dispositivos menores */
    margin-bottom: 20px; /* Espaçamento entre os blocos */
    text-align: left; /* Alinhamento padrão */
}

.footer-left p, .footer-left a {
    margin: 3px 0; /* Reduz o espaçamento entre as frases */
}

.footer-left a {
    color: #fff;
    text-decoration: none;
}

.footer-left a:hover {
    text-decoration: underline;
}

.footer-right form {
    display: flex;
    flex-direction: column; /* Empilha os elementos no padrão */
    align-items: stretch; /* Faz os elementos ocuparem a mesma largura */
    width: 100%; /* Garante que o formulário ocupe toda a largura disponível */
}

.input-group {
    display: flex;
    flex-direction: column; /* Empilhado por padrão */
    width: 100%; /* O grupo ocupa toda a largura disponível */
}

.footer-right input[type="email"],
.footer-right button {
    width: 100%; /* Ambos ocupam a mesma largura */
    box-sizing: border-box; /* Inclui padding e borda no cálculo de largura */
    margin: 0; /* Remove qualquer margem lateral que possa causar deslocamento */
}

.footer-right input[type="email"] {
    padding: 10px;
    margin-bottom: 10px; /* Espaço entre o input e o botão quando empilhados */
    border: 1px solid #ccc;
    border-radius: 5px;
}

.footer-right button {
    padding: 10px 20px;
    border: none;
    background-color: #1f3b52;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s;
    font-size: 14px; /* Texto legível */
    white-space: nowrap; /* Impede quebras no texto do botão */
}

.footer-right button:hover {
    background-color: #285d7b; /* Cor ao passar o mouse */
}

.footer-right label {
    margin-bottom: 10px; /* Mantém o espaçamento adequado entre o label e o campo */
}

/* Ajustes para telas menores que 768px */
@media (max-width: 768px) {
    footer {
        flex-direction: column; /* Empilha os elementos */
        align-items: center; /* Centraliza os itens no eixo horizontal */
        text-align: center; /* Centraliza o texto dentro dos itens */
    }

    .footer-left, .footer-right {
        align-items: center; /* Centraliza o conteúdo internamente */
    }

    .footer-left p, .footer-left a {
        margin: 2px 0; /* Reduz ainda mais o espaçamento entre as frases */
    }
}

/* Ajustes para telas maiores que 768px */
@media (min-width: 768px) {
    footer {
        flex-wrap: nowrap; /* Elementos lado a lado */
    }
    
    .footer-left, .footer-right {
        width: 48%; /* Ajuste proporcional */
    }
    
    .input-group {
        flex-direction: row; /* Alinha os elementos lado a lado */
        width: 100%;
    }

    .footer-right input[type="email"] {
        margin-bottom: 0; /* Remove o espaçamento extra */
        margin-right: 10px; /* Espaço entre input e botão */
        flex: 1; /* Faz o input ocupar o espaço restante */
    }

    .footer-right button {
        flex: none; /* Mantém o botão com tamanho fixo */
        width: auto; /* Adapta-se ao conteúdo */
    }
}

/*FIM DO FOOTER*/

.whatsapp-button-header {
    padding: 10px 20px;
    border: none;
    background-color: #25D366;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
    font-size: 16px;
    font-family: Arial, sans-serif;
    position: absolute;
    right: 20px; /* Alinha o botão ao canto direito com 20px de espaçamento */
    top: 50%; /* Centraliza verticalmente */
    transform: translateY(-50%); /* Ajusta o posicionamento para centralizar corretamente */
    text-decoration: none;
}

.whatsapp-button-header:hover {
    background-color: #075E54;
}

.whatsapp-bar {
    background-color: #193950;
    color: white;
    text-align: center;
    padding: 50px 0;
    width: 100%;
    top: 0;
    z-index: 1000;
}

.whatsapp-bar p {
    margin: 0; /* Remove a margem padrão dos parágrafos */
    font-size: 20px;
}

.whatsapp-bar p + p {
    margin-top: 10px; /* Adiciona uma pequena margem entre os parágrafos */
}

.contact-button {
    background-color: #25D366; /* Cor do botão */
    border: none;
    color: white; /* Cor do texto */
    padding: 10px 20px;
    margin-top: 10px; /* Pequena margem acima do botão */
    cursor: pointer;
    border-radius: 5px;
    font-size: 16px;
    font-family: Arial, sans-serif;
    display: inline-flex;
    align-items: center;
    text-decoration: none; /* Remover o sublinhado */
}

.contact-button i {
    margin-right: 8px;
}

.contact-button:hover {
    background-color: #075E54; /* Cor de fundo ao passar o mouse */
}

.thank-you-content {
    text-align: center;
    padding: 50px 20px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    max-width: 600px;
    margin: 50px auto;
}

.thank-you-content h1 {
    font-size: 2.5em;
    margin-bottom: 20px;
    color: #2c3e50;
}

.thank-you-content p {
    font-size: 1.2em;
    margin-bottom: 20px;
    color: #555;
}

/* INÍCIO DE POR QUE ME ESCOLHER */
.why-choose-me {
    background-color: #162733; /* Fundo mais claro e suave */
    padding: 60px 20px;
    text-align: center;
}

.why-choose-me .container {
    max-width: 1200px;
    margin: 0 auto;
}

.why-choose-me h2 {
    font-family: 'EB Garamond', serif;
    font-size: 2.5rem;
    color: #EFECED;
    margin-top: 0px; /* Ajuste o espaçamento em cima do título aqui */
    margin-bottom: 40px;
    font-weight: 600;
    letter-spacing: -0.5px; /* Ajuste fino no espaçamento das letras */
}

.differentials {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 30px; /* Espaçamento maior entre os itens */
}

.differential-item {
    background-color: #fff;
    border-radius: 12px; /* Bordas mais arredondadas */
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08); /* Sombra mais suave */
    padding: 30px;
    flex: 1 1 calc(33.333% - 20px); /* 3 colunas em telas maiores */
    text-align: center;
    box-sizing: border-box; /* Garante que o padding não ultrapasse a largura */
}

.differential-item .icon {
    font-size: 2rem;
    margin-bottom: 15px;
    color: #1f3b52; /* Cor do ícone */
}

.differential-item h3 {
    font-family: 'EB Garamond', serif;
    font-size: 1.5rem;
    color: #1f3b52;
    margin-bottom: 15px;
    font-weight: 600;
}

.differential-item p {
    font-family: 'Arial', sans-serif; /* Fonte sans-serif para o texto */
    font-size: 1rem;
    color: #555;
    line-height: 1.6; /* Espaçamento entre linhas maior */
}

.whatsapp-button {
    display: inline-flex;
    align-items: center;
    background-color: #25D366;
    color: #fff;
    padding: 12px 30px;
    border-radius: 8px;
    text-decoration: none;
    margin-top: 40px;
    font-size: 18px;
    font-family: 'Arial', sans-serif;
    transition: background-color 0.3s ease;
}

.whatsapp-button i {
    margin-right: 10px;
}

.whatsapp-button:hover {
    background-color: #1ebd50;
}

/* Responsividade */
@media (max-width: 768px) {
    .differential-item {
        flex: 1 1 calc(50% - 20px); /* 2 colunas em telas menores */
    }
}

@media (max-width: 480px) {
    .differential-item {
        flex: 1 1 100%; /* 1 coluna em telas muito pequenas */
    }

    .why-choose-me h2 {
        font-size: 2rem;
    }

    .differential-item h3 {
        font-size: 1.25rem;
    }

    .differential-item p {
        font-size: 0.9rem;
    }

    .whatsapp-button {
        font-size: 16px;
        padding: 10px 20px;
    }
}

/* INÍCIO FAQ */
.faq {
    background-color: #1f3b52; /* Fundo azul escuro */
    padding: 60px 20px;
    text-align: center;
    color: #fff; /* Texto branco */
}

.faq .container {
    max-width: 1200px;
    margin: 0 auto;
}

.faq h2 {
    font-family: 'EB Garamond', serif;
    font-size: 2.5rem;
    color: #fff;
    margin-top: 0px; /* Ajuste o espaçamento em cima do título aqui */
    margin-bottom: 40px;
    font-weight: 600;
    letter-spacing: -0.5px;
}

.faq-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 20px; /* Espaçamento entre os itens */
}

.faq-item {
    background-color: #16232b; /* Fundo escuro para os itens */
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    padding: 20px;
    flex: 1 1 calc(50% - 20px); /* 2 colunas em telas maiores */
    text-align: left;
}

.faq-question {
    display: flex;
    align-items: center;
    cursor: pointer; /* Indica que o item é clicável */
}

.faq-question .icon {
    font-size: 1.5rem;
    margin-right: 10px;
}

.faq-question h3 {
    font-family: 'EB Garamond', serif;
    font-size: 1.25rem;
    color: #fff;
    margin: 0;
}

.faq-answer {
    display: none; /* Resposta escondida por padrão */
    margin-top: 15px;
    font-family: 'Arial', sans-serif;
    font-size: 1rem;
    color: #ddd;
    line-height: 1.6;
}

.faq-item.active .faq-answer {
    display: block; /* Mostra a resposta quando o item está ativo */
}

.whatsapp-button {
    display: inline-flex;
    align-items: center;
    background-color: #25D366;
    color: #fff;
    padding: 12px 30px;
    border-radius: 8px;
    text-decoration: none;
    margin-top: 40px;
    font-size: 18px;
    font-family: 'Arial', sans-serif;
    transition: background-color 0.3s ease;
}

.whatsapp-button i {
    margin-right: 10px;
}

.whatsapp-button:hover {
    background-color: #1ebd50;
}

/* Responsividade */
@media (max-width: 768px) {
    .faq-item {
        flex: 1 1 100%; /* 1 coluna em telas menores */
    }

    .faq h2 {
        font-size: 2rem;
    }

    .faq-question h3 {
        font-size: 1.1rem;
    }

    .faq-answer {
        font-size: 0.9rem;
    }

    .whatsapp-button {
        font-size: 16px;
        padding: 10px 20px;
    }
}

/* ATENDIMENTO EM TODO O BRASIL */
.national-support {
    background-color: #1f3b52; /* Fundo azul escuro */
    padding: 60px 20px;
    color: #fff; /* Texto branco */
}

.national-support .container {
    max-width: 1200px;
    margin: 0 auto;
}

.content-wrapper {
    display: flex;
    align-items: center;
    gap: 40px; /* Espaçamento entre o mapa e o texto */
}

.map-container {
    flex: 1;
    max-width: 400px; /* Largura máxima do mapa */
}

.brazil-map {
    width: 100%;
    height: auto;
    border-radius: 12px; /* Bordas arredondadas (opcional, pode remover se não quiser) */
    border: none; /* Remove qualquer borda */
    outline: none; /* Remove o contorno ao focar na imagem */
    box-shadow: none; /* Remove qualquer sombra */
}

.text-container {
    flex: 2;
}

.text-container h2 {
    font-family: 'EB Garamond', serif;
    font-size: 2.5rem;
    color: #fff;
    margin-top: 0px; /* Espaçamento zerado no topo */
    margin-bottom: 20px;
    font-weight: 600;
    letter-spacing: -0.5px;
}

.text-container p {
    font-family: 'Arial', sans-serif;
    font-size: 1.2rem;
    color: #ddd;
    margin-bottom: 20px;
    line-height: 1.6;
}

.whatsapp-button {
    display: inline-flex;
    align-items: center;
    background-color: #25D366;
    color: #fff;
    padding: 12px 30px;
    border-radius: 8px;
    text-decoration: none;
    margin-top: 20px;
    font-size: 18px;
    font-family: 'Arial', sans-serif;
    transition: background-color 0.3s ease;
}

.whatsapp-button i {
    margin-right: 10px;
}

.whatsapp-button:hover {
    background-color: #1ebd50;
}

/* Responsividade */
@media (max-width: 768px) {
    .content-wrapper {
        flex-direction: row; /* Mantém o mapa e o texto lado a lado */
        gap: 20px; /* Reduz o espaçamento entre o mapa e o texto */
    }

    .map-container {
        max-width: 200px; /* Reduz o tamanho do mapa em telas menores */
    }

    .text-container h2 {
        font-size: 2rem;
    }

    .text-container p {
        font-size: 1rem;
    }

    .whatsapp-button {
        font-size: 16px;
        padding: 10px 20px;
    }
}

@media (max-width: 480px) {
    .content-wrapper {
        flex-direction: row; /* Mantém o mapa e o texto lado a lado */
        gap: 10px; /* Espaçamento menor para telas muito pequenas */
    }

    .map-container {
        max-width: 150px; /* Tamanho ainda menor para o mapa */
    }

    .text-container h2 {
        font-size: 1.75rem;
    }

    .text-container p {
        font-size: 0.9rem;
    }
}