@charset "UTF-8";
@media screen and (min-width:757px) and (max-width: 2000px){
    
/* ==================== */
/* ESTILOS GLOBAIS      */
/* ==================== */

* {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    box-sizing: border-box; 
}

body {
    background-color: #f8f8f8;
}
body a, button{
    font-family: 'Elegante Classica';
}
body h1, h2{
    font-family: 'Elegante Classica';

}body h3{
    font-family: 'Elegante Classica';
}
body h4{
    font-family: 'Elegante Classica';
}

body p, span{
    font-family: 'Lora';
}

:root {
    --color-primary: #586E26; /* Verde da marca */
    --color-secondary: #EBE9E6; /* Cor de fundo suave da seção hero */
    --color-Text: #8d676775;
    --color-cta: RGB(117, 85, 128); /* Verde do WhatsApp */
    --color-heading: #584D42; /* Marrom para títulos */
    --color-text-light: #555; /* Cinza para textos */



}
@font-face {
  font-family: 'Lora';
  src: url('fonts/Lora-Regular.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Lora';
  src: url('fonts/Lora-Italic.ttf') format('truetype');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Lora';
  src: url('fonts/Lora-Bold.ttf') format('truetype');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Lora';
  src: url('fonts/Lora-BoldItalic.ttf') format('truetype');
  font-weight: bold;
  font-style: italic;
}

/* Fonte Elegante Classica */
@font-face {
  font-family: 'Elegante Classica';
  src: url('fonts/Elegante Classica.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}


/* ============================ */
/* CABEÇALHO E NAVEGAÇÃO        */
/* ============================ */

.main-header {
    background-color: #ffffff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 50px;
    height: 90px;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    transition: all 0.4s ease;
}

.main-header.scrolled {
    height: 50px;
    padding: 10px 50px;
    background-color: rgba(255, 255, 255);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

.logo-link {
    display: flex;
    align-items: center;
}

.logo-image-large {
    height: 100px;
    transition: all 0.4s ease;
}

.logo-image-small {
    display: none;
    height: 40px;
    transition: all 0.4s ease;
}

.main-header.scrolled .logo-image-large {
    display: none;
}

.main-header.scrolled .logo-image-small {
    display: block;
}

.main-nav ul {
    display: flex;
    list-style: none;
    margin: 0;
    padding: 0;
}

.main-nav ul li {
    margin-left: 25px;
}

.main-nav ul li a {
    text-decoration: none;
    color: var(--color-text-light);
    font-weight: 500;
    font-size: 1.1em;
    transition: color 0.3s ease;
}

.main-nav ul li a:hover {
    color: var(--color-primary);
}

.whatsapp-button {
    background-color: var(--color-primary);
    color: #fff;
    padding: 10px 20px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: bold;
    font-size: 1em;
    transition: background-color 0.3s ease, font-size 0.4s ease, padding 0.4s ease;
}

.whatsapp-button:hover {
    background-color: #586e269f;
    color: #333;
}

.main-header.scrolled .whatsapp-button {
    font-size: 0.9em;
    padding: 8px 15px;
}
/* Esconde no desktop */
.menu-toggle {
  display: none;
  flex-direction: column;
  justify-content: space-between;
  width: 28px;
  height: 20px;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 999; /* fica por cima do menu */
}

.menu-toggle span {
  display: block;
  height: 3px;
  width: 100%;
  background: #fff; /* cor das barrinhas */
  border-radius: 3px;
  transition: all 0.3s ease;
}
/* ============================ */
/* SEÇÃO DE DESTAQUE     */
/* ============================ */

.imgSection{
    margin-top: 18px;
    width: 100%;
    height: 100vh;

    
}

.hero{
    display: none;
}
/* ==================== */
/* FORMULÁRIO           */
/* ==================== */



#whatsappForm {

    width: 600px;
    display: flex;
    flex-direction: column;
    margin-left: 20px;
    position: relative;
    top: -140px;
    left: 140px;
    
    
}

#whatsappForm > h1 {
    font-size: 2.5em;
    font-family: 'Lora';
    
    color: var(--color-text-light);
    width:750px;
}

label {
    font-weight: bold;
    color: #333;
    display: block;
}

input[type="text"], textarea {
    width: 80%;
    padding: 15px 20px;
    border-radius: 50px;
    font-size: 1em;
    outline: none;
    transition: border-color 0.3s ease;
}

input[type="number"]:focus, textarea:focus {
    border-color: var(--color-primary);
}

textarea {
    border-radius: 8px;
    resize: vertical;
}

button[type="submit"] {
    width: 90%;
    padding: 15px 20px;
    border: none;
    background-color: #755580;
    color: #fff;
    border-radius: 50px;
    font-size: 1.1em;
    font-weight: bold;
    cursor: pointer;
    box-shadow: 1px 1px 1px white;
    transition: background-color 0.3s ease, transform 0.2s ease;
    
}

button[type="submit"]:hover {
    background-color: #755580a8;
    transform: translateY(-2px);
}

/*Sobre mim e meu metodo*/
#sobre-mim {
    background-color: #f7f7f7;
    padding: 80px 20px;
    text-align: center;
    height: 98vh;
}

#sobre-mim > h2 { /* O título principal da seção */
    font-size: 2.5em;
    color: var(--color-text-light); /* Verde escuro do PDF */
    margin-bottom: 50px;
}

.container-sobre-mim {
    display: flex;
    justify-content: center;
    align-items: flex-start; /* Alinha os itens pelo topo */
    gap: 40px;
    flex-wrap: wrap; /* Permite quebrar a linha em telas menores */
}

/* Bloco Quem Sou  */
.bloco-quem-sou {
    flex: 1;
    min-width: 300px;
    max-width: 400px;
    height: 810px; /* Ajuste a largura conforme necessário */
    padding-top: 50px; /* Para alinhar com a imagem central */
}

.cartao-perfil {
    background-color: #fff;
    border: 3px solid #72895E; /* Borda verde do PDF */
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    text-align: center;
    height: 100%; /* Garante que o cartão ocupe o espaço disponível */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Alinha o conteúdo ao topo */
}

.cartao-perfil h3 {
    font-size: 2.5em;
    color: #72895E; /* Verde escuro do PDF */
    margin-top: 0; /* Remove margem superior desnecessária */
    margin-bottom: 20px;
}

.descricao-perfil {
    font-size: 1.5em;
    color: #555;
    line-height: 1.6;
    margin: 10px auto;
}

/* Seção da Foto Central */
.secao-foto-central {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.imagem-central {
    width: 600px; /* Ajuste o tamanho da imagem conforme desejar */
    height: 790px;
    object-fit: cover;
   
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
}

/* Bloco Meu Método  */
.bloco-metodo {
    flex: 1;
    min-width: 300px;
    text-align: center;
    padding-top: 50px; /* Para alinhar com a imagem central */
    height: 700px;
}
.oculto {
  opacity: 0;
  transform: translateY(20px); /* Move os elementos 20px para baixo */
  transition: opacity 1s ease-out, transform 1s ease-out; /* Transição suave de 1 segundo */
}

.surgir {
  opacity: 1;
  transform: translateY(0); /* Retorna os elementos para a posição original */
}
.cabecalho-metodo h2 {
    font-size: 4.5em;
    color: #72895E; /* Verde escuro do PDF */
    margin-bottom: 60px;
    font-family: 'Elegante Classica';
}

.cabecalho-metodo p {
    font-size: 1.8em;
    color: #555;
    line-height: 1.6;
    margin-bottom:30px;
    font-family: 'Lora';
}

.grade-pilares {
    display: flex;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    height: 400px;
}

.pilar-card {
    background-color: #755580; /* Roxo escuro do PDF */
    color: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    text-align: center;
    box-shadow: 1px 1px 5px black;
}
.pilar-icone {
        width: 100px; /* Largura do círculo */
        height: 100px; /* Altura do círculo (igual à largura) */
        border-radius: 50%; /* Transforma a imagem em um círculo */
        object-fit: cover; /* Faz a imagem preencher o círculo sem distorcer */
        border: 3px solid #755580; /* Borda roxa para a moldura */
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
        margin-bottom: 20px; /* Espaço entre a imagem e o título */
    }
.pilar-card h4 {
    font-size: 1.1em;
    font-weight: bold;
    margin-bottom: 10px;
    text-align: center;
    color: var(--color-primary);
    border: 3px solid white;
    border-radius: 10px;
    padding: 10px;
    background-color: white;
}

.pilar-card p {
    margin-top: 20px;
    font-size: 1.5em;
    line-height: 1.4;
    color: #f0f0f0;
  
}


/*Serviços*/

#servicos {
    background-color: #72895E;
    padding: 80px 20px;
    text-align: center;
    padding: 100px;
    
}

#servicos h2 {
    font-size: 2.5em;
    color: var(--color-text-light);
    margin-bottom: 50px;
}

.container-servicos {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
    
}

.cartao-servico {
    background-color: #fff;
    border: 2px solid #72895E;
    border-radius: 20px;
    padding: 30px;
    width: 600px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    box-shadow: 1px 1px 5px black;

}

.cartao-servico h3 {
    font-size: 1.6em;
    color: #72895E;
    margin-bottom: 15px;
}

.cartao-servico p {
    font-size: 1.2em;
    color: #555;
    line-height: 1.6;
    margin-bottom: 25px;
}

.botao-saiba-mais {
    display: inline-block;
    padding: 12px 25px;
    background-color: #72895E;
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}

.botao-saiba-mais:hover {
    background-color: #5e724a;
}

/*plano acompanhamento nutricional*/

/*plano acompanhamento nutricional*/
#como-funciona-acomp > .conteudo-cabecalho > p{
    color: #fff;
    font-size: 25px;
}


#como-funciona-acomp {
    background-color: #72895E;
    padding: 80px 50px;
    text-align: center;
    /* Remover height: 100vh; para que a seção se adapte ao conteúdo */
}

#como-funciona-acomp h2 {
    font-size: 3em;
    color: #fff;
    margin-bottom: 50px;
    margin-top: 40px;
}

/* Removi o estilo de #como-funciona-acomp p para que o estilo da nova classe de texto não seja sobrescrito */

/* Novo contêiner para o layout flexível */
.conteudo-flex {
    display: flex;
    justify-content: center;
    gap: 50px;
    flex-wrap: wrap; /* Permite quebras de linha em telas pequenas */
    align-items: flex-start; /* Alinha o texto e os cartões no topo */
}

/* Novo estilo para a caixa de texto */
.texto-explicacao {
    background-color: rgba(255, 255, 255, 0.1); /* Cor de fundo com transparência */
    border-radius: 10px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    border: 2px solid #755580; /* Borda correspondente aos cartões */
    flex-basis: 40%; /* Largura de base, pode ser ajustado */
    text-align: left;
    color: #f0f0f0;
}

.texto-explicacao p {
    font-size: 1.7em;
    line-height: 1.6;
    margin-bottom: 20px;
}

.texto-explicacao strong {
    color: #755580; /* Destaque em outra cor para as palavras-chave */
    font-weight: bold;
}

/* Estilos existentes para os cartões */
.grade-cards {
    display: flex;
    flex-direction: column; /* Organiza os cartões verticalmente */
    justify-content: flex-start;
    gap: 30px;
    flex-wrap: wrap;
}

.cartao-info {
    margin-top: 0; /* Removido o margin-top para alinhar com o texto */
    background-color: #ffffff;
    color: #555;
    padding: 30px;
    border-radius: 10px;
    width: 435px; /* Manter a largura */
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    display: flex;
    flex-direction: column;
    text-align: left;
    border: 2px solid #755580;
}

.oculto {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 1s ease-out, transform 1s ease-out;
}

.surgir {
    opacity: 1;
    transform: translateY(0);
}

.cartao-info h3 {
    font-size: 1.2em;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 3px solid #a396a6;
    padding-bottom: 10px;
}

.cartao-info ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.cartao-info li {
    margin-bottom: 10px;
    font-size: 1.3em;
    line-height: 1.4;
    display: flex; /* Adiciona flexbox para o ícone de check */
    align-items: center;
}

.cartao-info li .check-icon {
    margin-right: 10px;
    color: #755580;
    font-weight: bold;
}

/* Espaçamento central já definido no .conteudo-flex */
.conteudo-flex {
    /* ... seu código existente ... */
    gap: 60px; /* Aumentar o gap para um espaço maior */
    position: relative; /* Necessário para posicionar as linhas com base no contêiner */
}

.texto-explicacao {
    /* ... seu código existente ... */
    position: relative; /* Necessário para o posicionamento da linha central */
    left: -250px;
    height: 875px;
    font-size: 1.2em;
    background-color: #fff;
    color: #755580;
}

/* Novo código para as linhas */
.grade-cards {
    /* ... seu código existente ... */
    position: relative;
}

/* Linha central que conecta os cards ao texto */
.grade-cards::before {
    content: '';
    position: absolute;
    top: 55%;
    left: -311px; /* Ajuste a distância do texto */
    width: 313px;
    height: 5px;
    background-color: #a396a6;
    transform: translateY(-50%);
}

/* Linha superior que se conecta ao primeiro card */
.grade-cards .cartao-info:first-child::before {
    content: '';
    position: absolute;
    top:150px;
   left: -313px; /* Ajuste a distância do texto */
    width: 313px;
    height: 5px; /* A altura da linha vertical */
    background-color: #a396a6;
    transform: translateY(-50%);
}

/* Linha inferior que se conecta ao último card */
.grade-cards .cartao-info:last-child::before {
    content: '';
    position: absolute;
    bottom: 124;
    left: -313px; /* Ajuste a distância do texto */
    width: 313px;
    height: 5px;
    background-color: #a396a6;
    transform: translateY(50%);
}


/* Para a linha reta entre os cards, você pode usar uma borda ou outro pseudo-elemento */

/*Planos de serviço  */



 #avaliacoes {
    background-color: var(--color-background);
    padding: 80px ;
    text-align: center;

}

 #planos h2, #avaliacoes h2 {
    font-size: 2.5em;
    color:  #755580;
    margin-bottom: 50px;
    text-align: center;
}


/* Estilo para os cards de planos */
.planos-container {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 30px;
    margin-top: 50px;
}

.plano-card {
    background-color: #fff;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    text-align: left;
    max-width: 400px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
        border: 2px solid var(--color-primary);

}

.plano-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}

.plano-card.popular {
    border: 2px solid var(--color-primary);
    position: relative;
    background-color: #72895e9c;
}

.plano-card.popular::before {
    content: "Plano mais popular";
    position: absolute;
    top: -15px;
    left: 65%;
    transform: translateX(-50%);
    background-color: #755580;
    color: #fff;
    padding: 10px 15px;
    border-radius: 50px;
    font-size: 0.8em;
    white-space: nowrap;
}

.plano-card.custo {
    background-color: #fff;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    text-align: left;
    max-width: 400px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.plano-card.custo:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}

.plano-card.custo {
    border: 2px solid var(--color-primary);
    position: relative;
}

.plano-card.custo::before {
    content: "Melhor custo-benefício";
    position: absolute;
    top: -15px;
    left: 65%;
    transform: translateX(-50%);
    background-color: #755580;
    color: #fff;
    padding: 10px 15px;
    border-radius: 50px;
    font-size: 0.8em;
    white-space: nowrap;
}



/* Estilos para a nova etiqueta do plano */
.plano-card.custo-beneficio {
    border: 3px solid #75925c;
}

/* Estilos para o botão "Agendar Consulta" com a seta */
.agendar-button .arrow-icon {
    margin-left: 10px;
    font-size: 1.2em;
}

.plano-card h3 {
    font-size: 2em;
    color: var(--color-cta);
    margin-bottom: 10px;
}

.plano-card p{
    margin-bottom: 20px;


}
.plano-card ul {
    list-style: none;
    padding: 0;
    margin-top: 20px;
}

.plano-card ul li {
    font-size: 0.9em;
    color: var(--color-text-light);
    margin-bottom: 10px;
}

.plano-card ul {
    list-style: none; /* Remove a bolinha padrão da lista */
    padding: 0;
    margin: 0;
    text-align: left;
    width: 100%;
}

.plano-card li {
    margin-bottom: 15px;
    font-size: 0.95em;
    color: #555;
    display: flex;
    align-items: center;
}

.check-icon {
    color: #72895E; /* A cor verde do ícone */
    font-weight: bold;
    margin-right: 10px;
    font-size: 1.2em;
}

.agendar-button {
    display: block;
    background-color: var(--color-primary);
    color: #fff;
    padding: 12px 20px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: bold;
    margin-top: 20px;
    transition: background-color 0.3s ease;
    text-align: center;
}

.agendar-button:hover {
    background-color: #75925c;

}
/*Plano Acompanhamento nutri*/






/*Plano express*/

#como-funciona {
    margin-top: 105px;
    background-color:#72895eb2;
    padding: 80px 50px;
    text-align: center;
    width: 100%;
}

#como-funciona > h2 {
    font-size: 2.5em;
    font-weight: bold;
    color: #755580;
    margin-bottom: 20px;
    margin-top: 30px;
    text-align: center;
    line-height: 1.2;
}

#como-funciona  p {
    font-size: 1.2em;
    color: #755580;
    margin-bottom: 10px;
    max-width: 800px;
    margin: 0 auto 10px auto;
    
}

.cards-container {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
    margin-top: 50px;
}

.cards-container .card {
    background-color: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
    width: 300px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border: 2px solid var(--color-cta);
}

.cards-container .card h3 {
    font-size: 1.2em;
    color: #755580;
    margin-bottom: 15px;
    border-bottom: 2px solid #755580;
    padding-bottom: 5px;
    text-align: center;
}

.cards-container .card ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.cards-container .card li {
    font-size: 0.9em;
    color: #555;
    line-height: 1.5;
    margin-bottom: 10px;
}


/* Estilos da seção principal */
.chamada-para-acao {
    height: 100vh;
   width: 99.2vw;
  background-color: #755580;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 80px 20px;
  text-align: center;
}

/* Estilos do contêiner de conteúdo */
.chamada-para-acao__conteudo {
  max-width: 1000px;
}

/* Estilo para o texto superior */
.chamada-para-acao__texto-superior {
  font-size: 50px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  margin-bottom: 40px;
  opacity: 0.8;
}

/* Estilos do título principal */
.chamada-para-acao__titulo {
  font-size: 50px;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 50px;
  color: #fff;
}

/* Estilos do subtítulo */
.chamada-para-acao__subtitulo {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.5;
  margin-bottom: 40px;
  opacity: 0.9;
color: #fff;

}

/* Estilos do botão */
.chamada-para-acao__botao {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 25px 100px;
  background-color: #d7ff43;
  color: #000;
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  border-radius: 50px;
  transition: transform 0.3s ease, background-color 0.3s ease;
}

.chamada-para-acao__botao:hover {
  transform: translateY(-3px);
  background-color: #bdfd00;
}

/* Estilos do ícone SVG dentro do botão */
.chamada-para-acao__icone {
  width: 20px;
  height: 20px;
}




/*avaliações*/

.tituloAvaliacoes{
    height: 90vh;
    margin-top: 25px;
}
.tituloAvaliacoes > h1{
    margin-top: 100px;
    margin-bottom: 30px;
    text-align: center;
    font-size: 2.5em;
    color: var(--color-heading);
}

#avaliacoes a {
    text-decoration: none;
}



#avaliacoes {
    background-color: var(--color-background);
    padding: 40px 50px;
    text-align: left;
    

}

#avaliacoes h2 {
    font-size: 2.5em;
    font-family: 'dream', serif;
    color: var(--color-heading);
    margin-bottom: 50px;
    position: relative;
    left: 50%;
}

.avaliacoes-container {
    position: relative; /* Essencial para que os grupos fiquem no lugar certo */
    width: 90%;
    margin: 30px auto;
    /* Remover a propriedade max-height para evitar problemas de layout */
}

.avaliacao-group {
    opacity: 0;
    visibility: hidden;
    position: absolute; /* Esta linha empilha os grupos no mesmo lugar */
    top: 0; /* Alinha no topo do contêiner */
    left: 0; /* Alinha à esquerda do contêiner */
    width: 100%; /* Garante que o grupo ocupe toda a largura */

    /* Configuração para o layout dos cards */
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
    
    /* Transições */
    transition: opacity 0.5s ease, visibility 0.5s ease;
}

.avaliacao-group.active {
    opacity: 1;
    visibility: visible;
    position: static; /* Volta para o fluxo normal quando ativo */
}
/* O resto do código dos cards permanece o mesmo */
.avaliacao-card {
    background-color: #fff;
    padding: 25px;
    border-radius: 10px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.05);
    border-left: 4px solid var(--color-primary);
    
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 23%;
}

.avaliacao-card h4 {
    font-size: 1.2em;
    color: var(--color-heading);
    margin-bottom: 5px;
    text-align: left;
}

.avaliacao-card p {
    font-style: italic;
    color: var(--color-text-light);
    line-height: 1.5;
    font-size: 0.9em;
    margin-bottom: 10px;
}

.google-review-link {
    text-align: right;
}

.google-review-link img {
    width: 30px;
    height: auto;
    transition: transform 0.2s ease;
}

.google-review-link img:hover {
    transform: scale(1.1);
}

/*img final*/

.imgfinal > .acomp-instagram{

    padding: 30px;
    text-align: center;
    font-family: var(--text-roboto);
    font-weight: bolder;

}

.imgfinal > .acomp-instagram > p{
    color: #72895E;
    text-align: center;
}

.imgfinal > .acomp-instagram > p > a{
    margin-left: 15px;
    color: #755580;
    letter-spacing: 3px;
}

 
.imgfinal > .acomp-instagram > p > a > .material-symbols-outlined{
position: relative;
top:5px;

}


.box-agendar-consulta {
    height: 150px;
    background-color: #774372; /* Cor de fundo da imagem */
    padding: 0 50px; /* Adiciona espaçamento nas laterais */
    
    /* Configurações Flexbox */
    display: flex;
    justify-content: space-between; /* Distribui o texto e o botão para as extremidades */
    align-items: center; /* Centraliza os itens verticalmente */
}

.texto-agendar p {
    font-family: Arial, sans-serif;
    color: #fff; /* Cor do texto */
    line-height: 1.4;
    font-size: 1.2em;
    text-transform: uppercase;
}

.botao-agendar a {
    background-color: #72895E; /* Fundo do botão */
    color: #ffff; /* Cor do texto do botão */
    font-family: Arial, sans-serif;
    font-weight: bold;
    text-decoration: none;
    padding: 20px 30px; /* Aumenta a área clicável e dá o formato do botão */
    border-radius: 50px; /* Arredonda as bordas do botão */
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Estilo para o ícone do WhatsApp */
.botao-agendar a span::after {
    content: '';
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url('imagens/whatsapp.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}


.imgfinal > .div-img > img{
    width: 99.2vw;
}
.imgfinal > .div-img-mobile > img{
    display: none;
}

.imgfinal > .div-texto-mobile > img{
    display: none;
}

/*footer*/

#rodape {
    background-color: #72895e; /* Fundo cinza escuro */
    color: #f0f0f0;
    padding: 60px 20px;
    margin: auto;
    height: 250px;
}

.container-rodape {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    max-width: 1400px;
    margin: auto;
    max-height: 250px;
    gap: 35px;
    

}

.coluna-info {
    flex: 1;
    margin-bottom: 20px;
    font-size: 13px;
    text-align: left;

}

.coluna-info.navegacao{
    margin-right: -80px;
}

.logo-rodape {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-bottom: 10px;
    margin-top: -50px;
    margin-right: 10px;
}

.logo-rodape img {
    margin-top: 25px;
    height: 180px; /* Ajuste o tamanho da sua logo aqui */
}

.texto-logo p {
    margin: 0;
    font-size: 1.3em;
    color: #f0f0f0;
    text-align: left;
    width: 240px;
}

.coluna-info h4 {
    font-size: 1.2em;
    color: #fff; /* Verde escuro do PDF */
    margin-bottom: 20px;
    text-transform: uppercase;
    font-family: var(--text-roboto);
    text-align: left;
}


.coluna-info ul li {
    font-size: 13px;
    line-height: 1.6;
    margin-bottom: 8px;
    text-align: left;
}

.coluna-info ul {
    list-style: none;
    padding: 0;
}


.coluna-info.atendimento > a{
    text-align: left;
    margin-left: 10px;
}
.coluna-info.atendimento > p{
   margin-bottom: 15px;
    text-align: left;


}


.coluna-info a {
    color: #f0f0f0;
    text-decoration: none;
    transition: color 0.3s ease;
}

.coluna-info a:hover {
    color: black;
}

.container-botoes {
    display: flex;
    flex-direction: column;
    gap: 15px;
    text-align: left;
}

.container-botoes > a{
    margin-left: -10px;
}

.botao-mapa {
    margin: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    background-color: #755580;
    height: 35px;
    width: 150px;
    border-radius: 5px;
    font-size: 15px;
}

.botao-mapa img {
    height: 20px;
    padding-left: 5px;
}

.link-social {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 10px;
}

.link-social img {
    height: 30px;
    border-radius:10px ;
}

.coluna-info.redes-sociais > a{
    margin-left: 15px;
    width: 250px;
    font-size: 18px;
}


/*bnt wpp flutuante*/

.botao-wpp-flutuante {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 40px;
    right: 40px;
    background-color: #25d366;
    color: #fff;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 3px #999;
    z-index: 100; /* Garante que o botão fique acima de outros elementos */
    display: flex;
    align-items: center;
    justify-content: center;
}

.botao-wpp-flutuante img {
    width: 45px;
    height: 45px;
}

}