body {
  font-family: Arial, sans-serif;
  margin: 0;
  padding: 0;
  color: #32373c;
  background-color: #ffffff;
  background-image: url('fundo_text.jpeg');
}

body,
html {
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  /* Evita rolagem horizontal */
}

header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #a8766d;
  padding: 10px 20px;
  color: white;
}

.logo img {
  max-width: 350px;
  position: relative;
  width: 110%;
  margin: 0;
  /* Remove qualquer margem */

  object-fit: cover;
  /* Preenche a tela sem distorção */
}

/*=============================================================================================*/

.menu {
  font-size: 16px;
  line-height: 1.6;
  color: #000000;
  display: flex;
  list-style: none;

  margin: 0;
}

.menu a {
  text-decoration: none;
  color: inherit;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  background-color: rgba(168, 118, 109, 0.5);
}

.menu .link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 12px 36px;
  border-radius: 16px;
  overflow: hidden;
  transition: all 0.48s cubic-bezier(0.23, 1, 0.32, 1);
}

.menu .link::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #32373c;
  z-index: -1;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.48s cubic-bezier(0.23, 1, 0.32, 1);
}

.menu .item {
  position: relative;
}

.menu .item .submenu {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  top: 100%;
  border-radius: 0 0 16px 16px;
  right: 0;
  /* Alinha o submenu à direita para garantir que ele não saia da tela */
  min-width: 100%;
  /* Garante que o submenu tenha no mínimo a largura do item pai */
  width: auto;
  /* Permite que o submenu se ajuste ao conteúdo */
  overflow: hidden;
  border: 1px solid #cccccc;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-12px);
  transition: all 0.48s cubic-bezier(0.23, 1, 0.32, 1);
  z-index: 1;
  pointer-events: none;
  list-style: none;
}

.menu .item:hover .submenu {
  opacity: 1;
  /* Ajustado para não ultrapassar 1 */
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
  border-top: transparent;
  border-color: #a8766d;
}

.submenu .submenu-link {
  display: block;
  padding: 12px 12px;
  width: auto;
  /* Ajusta a largura conforme o conteúdo */
  white-space: nowrap;
  /* Evita que o texto quebre em várias linhas */
  position: relative;
  text-align: center;
  transition: all 0.48s cubic-bezier(0.23, 1, 0.32, 1);
  margin-right: 40px;
}



.menu .item:hover .link::after {
  transform: scaleX(1);
  transform-origin: right;
}

.menu .item:hover .link svg {
  fill: #ffffff;
  transform: rotate(-180deg);
}

.submenu .submenu-item {
  width: 100%;
  transition: all 0.48s cubic-bezier(0.23, 1, 0.32, 1);
}

.submenu .submenu-link {
  display: block;
  padding: 12px 12px;
  width: 100%;
  position: relative;
  text-align: center;
  transition: all 0.48s cubic-bezier(0.23, 1, 0.32, 1);
}

.submenu .submenu-item:last-child .submenu-link {
  border-bottom: none;
}

.submenu .submenu-link::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  transform: scaleX(0);
  width: 100%;
  height: 100%;
  background-color: #a8766d;
  z-index: -1;
  transform-origin: left;
  transition: transform 0.48s cubic-bezier(0.23, 1, 0.32, 1);
}

.submenu .submenu-link:hover:before {
  transform: scaleX(1);
  transform-origin: right;
}

.submenu .submenu-link:hover {
  color: #ffffff;
}



/*=============================================================================================*/
.playfair-display {
  font-family: "Playfair Display", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

.bebas-neue-regular {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 1;
  font-style: normal;
}

.architects-daughter-regular {
  font-family: "Architects Daughter", cursive;
  font-weight: 400;
  font-style: normal;
}

.playfair-1 {
  font-family: "Playfair", serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}

nav {
  font-size: large;
  display: flex;
  justify-content: space-between;
  /* Alinha os itens ao longo do eixo principal */
  align-items: center;
  /* Alinha os itens ao longo do eixo transversal */
  padding: 10px 20px;
  /* Adiciona algum espaçamento interno */
}

nav .nav-list {
  text-decoration: none;
  align-items: center;
  list-style: none;
  display: flex;
  gap: 20px;
  margin: 0;
  padding: 0;
}

nav .nav-list li a {
  position: relative;
  text-decoration: none;
  /* Remove sublinhado padrão */
  color: #3f3538;
  font-weight: bold;
}



nav .nav-list li a:hover::after {
  width: 100%;
  /* Expande o sublinhado da esquerda para a direita ao passar o mouse */
}


.contact-button {
  text-decoration: none;
  text-align: center;
}

button {
  padding: 17px 40px;
  font-size: large;
  display: flex;
  justify-content: space-between;
  /* Alinha os itens ao longo do eixo principal */
  align-items: center;
  /* Alinha os itens ao longo do eixo transversal */
  font-weight: bold;
  border-radius: 50px;
  cursor: pointer;
  border: 0;
  color: #3f3538;
  background-color: #a8766d;
  box-shadow: #a8766d;
  transition: all 0.5s ease;
  display: flex;
  align-items: center;
  gap: 10px;
  /* Espaço entre o texto e o ícone */
}

button:hover {
  letter-spacing: 2px;
  background-color: hsl(0, 0%, 100%);
  color: #3f3538;
  box-shadow: rgb(0, 0, 0) 0px 7px 29px 0px;
}

button:active {
  letter-spacing: 2px;
  background-color: hsl(0, 0%, 0%);
  color: hsl(0, 0%, 100%);
  box-shadow: rgb(0, 0, 0) 0px 0px 0px 0px;
  transform: translateY(10px);
  transition: 100ms;
  text-decoration: none;
}

.w-6 {
  width: 24px;
  height: 24px;
}

.text-gray-800 {
  color: #3f3538;
}

.dark\:text-white {
  color: #3f3538;
}




main {
  padding: 40px 20px;
}

.img-ini {
  display: flex; /* Ativa o Flexbox para organizar os itens em linha */
  align-items: center; /* Centraliza verticalmente os itens */
  justify-content: center; /* Alinha os itens à esquerda */
  gap: 50px; /* Espaço entre a imagem e o texto */
  padding: 20px; /* Espaço interno para um layout agradável */
}

.img-ini img {
  max-width: 20%; /* Ajusta a largura da imagem proporcionalmente */
  height: auto; /* Mantém a proporção da imagem */
  }

.img-ini h1 {
  color: #3f3538; /* Cor do texto */
  font-size: 2em; /* Tamanho do texto */
  font-weight: 500; /* Espessura do texto */
  margin: 0; /* Remove margens desnecessárias */
  text-align: left; /* Alinha o texto à esquerda */
}

/* Media query para telas menores (tablets e celulares) */
@media (max-width: 768px) {
  .img-ini {
    display: flex; /* Ativa o Flexbox para organizar os itens em linha */
    align-items: center; /* Centraliza verticalmente os itens */
    justify-content: center; /* Alinha os itens à esquerda */
    gap: 20px; /* Espaço entre a imagem e o texto */
    padding: 20px; /* Espaço interno para um layout agradável */
  }
  
  .img-ini img {
    max-width: 30%; /* Ajusta a largura da imagem proporcionalmente */
    height: auto; /* Mantém a proporção da imagem */
    border-radius: 20px; /* Bordas arredondadas */
  }
  
  .img-ini h1 {
    color: #3f3538; /* Cor do texto */
    font-size: 1.7em; /* Tamanho do texto */
    font-weight: 500; /* Espessura do texto */
    margin: 0; /* Remove margens desnecessárias */
    text-align: center; /* Alinha o texto à esquerda */
  }
}

.container {
  display: flex; /* Organiza os itens em linha */
  align-items: center; /* Centraliza verticalmente */
  justify-content: space-between; /* Espaço entre os itens */
}

.box1, .box2 {
  padding: 20px;
  background-color: #f0f0f0;
  border-radius: 5px;
}

.box-with-line {
  background-image: url('fundo_text.jpeg');
  position: relative; /* Necessário para posicionar o pseudo-elemento */
  padding: 20px; /* Espaço interno para o conteúdo */
  background-color: #f0f0f0; /* Fundo da div */
  text-align: center; /* Centraliza o texto dentro da div */
}

.box-with-line::after {
  content: ''; /* Cria o pseudo-elemento */
  position: absolute; /* Permite posicionar a linha */
  background-image: fundo;
  left: 10%; /* Ajusta a margem esquerda */
  right: 10%; /* Ajusta a margem direita */
  height: 2px; /* Espessura da linha */
  background-color: #000; /* Cor da linha */
}

.box-with-line2 {
  position: relative; /* Necessário para posicionar o pseudo-elemento */
  padding: 20px; /* Espaço interno para o conteúdo */
  background-color: #a8766d; /* Fundo da div */
  text-align: center; /* Centraliza o texto dentro da div */
}

.box-with-line2::after {
  content: ''; /* Cria o pseudo-elemento */
  position: absolute; /* Permite posicionar a linha */
  background-image: fundo;
  left: 10%; /* Ajusta a margem esquerda */
  right: 10%; /* Ajusta a margem direita */
  height: 2px; /* Espessura da linha */
  background-color: #000; /* Cor da linha */
}

.overlay-title {
  text-align: center;
  font-size: 24px;
  /* Tamanho do texto */
  color: #3f3538;
}


.card_contact {
  display: flex;
  justify-content: center;
  /* Centraliza horizontalmente */
  align-items: center;
  /* Centraliza verticalmente */
  text-align: center;
}

.AvPs {
  display: flex;
  justify-content: center;
  /* Centraliza horizontalmente */
  align-items: center;
  /* Centraliza verticalmente */
  text-align: center;
  margin-left: 50px; /* Ajuste esse valor conforme necessário */
}

/* Estilos gerais da seção */
.custom-section {
  position: relative;
  background-image: url('fundo_text.jpeg');
  padding: 50px 0;
  /* Remove a margem lateral */
  text-align: center;
  overflow: hidden;
  /* Garante que nada saia dos limites da seção */
}

/* Estilos das formas no topo e na parte inferior */
.custom-shape {
  position: absolute;
  width: 100%;
  overflow: hidden;
  line-height: 0;
}

.custom-shape-top {
  top: 0;
  left: 0;
}

.custom-shape-bottom {
  bottom: 0;
  left: 0;
}

.custom-shape svg {
  position: relative;
  display: block;
  width: 100%;
  /* Garante que o SVG preencha toda a largura do contêiner */
  height: 50px;

}

.custom-shape-fill {
  fill: #a8766d;
  /* Define a cor de preenchimento do SVG */
}

/* Conteúdo da seção */
.custom-content {
  z-index: 1;
  position: relative;
  padding: 20px;
  /* Adiciona um pouco de padding ao conteúdo */
  background-color: #a8766d;
  /* Cor de fundo do conteúdo para garantir contraste */
}

.custom-content h2 {
  font-size: 2.5em;
  color: #3f3538;
}




/* Seletor mais específico para os botões dentro de .custom-content */

.custom-content {
  text-align: center;
  /* Centraliza o texto e elementos inline dentro da div */
}

.custom-content button {
  display: inline-block;
  /* Garante que o botão se comporte como um bloco inline para centralização */
  margin: 10px;
  /* Adiciona um pouco de espaçamento ao redor dos botões */
}

.custom-content button a {
  position: relative;
  display: inline-block;
  padding: 15px 30px;
  border: 2px solid #3f3538;
  text-transform: uppercase;
  color: #3f3538;
  text-decoration: none;
  font-weight: 600;
  font-size: 20px;

}


/* Remover qualquer efeito de hover */
.custom-content button:hover::before,
.custom-content button:hover::after {
  transform: none;
  /* Garante que não haja transformação ao passar o mouse */
  transition: none;
  /* Remove qualquer transição ao passar o mouse */
}

.custom-content button a::before,
.custom-content button a::after {
  content: '';
  position: absolute;
  transition: none;
}

.custom-content button a::before {
  top: 6px;
  left: -2px;
  width: calc(100% + 4px);
  height: calc(100% - 12px);
  background-color: #a8766d;
  transform: scaleY(1);
  animation: slideY 4s infinite;
}

.custom-content button a::after {
  left: 6px;
  top: -2px;
  height: calc(100% + 4px);
  width: calc(100% - 12px);
  background-color: #a8766d;
  transform: scaleX(1);
  animation: slideX 4s infinite;
}

.custom-content button a span {
  position: relative;
  z-index: 3;
}


.custom-content button {
  background-color: none;
  text-decoration: none;
  background-color: #a8766d;
  border: none;
}

/* Keyframes for the animation */
@keyframes slideY {
  0% {
    transform: scaleY(1);
  }

  50% {
    transform: scaleY(0);
  }

  100% {
    transform: scaleY(1);
  }
}

@keyframes slideX {
  0% {
    transform: scaleX(1);
  }

  50% {
    transform: scaleX(0);
  }

  100% {
    transform: scaleX(1);
  }
}


.intro {
  background-image: url('fundo_text.jpeg');
  /* Cor de fundo da seção */
  color: #3f3538;
  /* Cor do texto */
  padding: 40px;
  /* Espaçamento interno da seção */

}

.intro-content {
  display: flex;
  border-radius: 20px;
  align-items: center;
  /* Alinha verticalmente o texto com a imagem */
  max-width: 1200px;
  /* Ajuste conforme necessário */
  margin: 0 auto;
  /* Centraliza o conteúdo horizontalmente */
  flex-direction: row-reverse;
}

.intro-image {
  width: 45%;
  /* Ajuste o tamanho da imagem conforme necessário */
  height: auto;
  margin-right: 60px;
  /* Espaçamento entre a imagem e o texto */
  border-radius: 50px;
}

.intro-image2 {
  width: 45%;
  /* Ajuste o tamanho da imagem conforme necessário */
  height: auto;
  margin-right: 60px;
  /* Espaçamento entre a imagem e o texto */
  border-radius: 60px;
}

.intro-text {
  width: 100%;
  /* Ajuste o tamanho do texto conforme necessário */
}

.intro-text h3 {

  margin: 0;
  /* Remove a margem padrão do h2 */
}


.services {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  gap: 20px;
}

.service {
  text-align: center;
  flex: 1 1 200px;
}

.service i {
  font-size: 2em;
  color: #25d366;
}

.service h3 {
  margin-top: 10px;
  font-size: 1.2em;
}

/* Cards de doenças */
.card {
  position: relative;
  width: 350px;
  height: 250px;
  border-radius: 14px;
  z-index: 11111;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  
}

.bg {
  position: absolute;
  top: 5px;
  left: 5px;
  width: 340px;
  height: 240px;
  z-index: 2;
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(24px);
  border-radius: 10px;
  overflow: hidden;
  outline: 2px solid rgb(255, 255, 255);
}

.blob {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: 200px;
  height: 150px;
  border-radius: 50%;
  background-color: #000000;
  opacity: 1;
  filter: blur(12px);
  animation: blob-bounce 5s infinite ease;
}

.title {
  position: absolute;
  top: 20px;
  /* Ajusta a distância do topo conforme necessário */
  display: flex;
  align-items: center;
  z-index: 3;
  /* Certifica-se de que o título fique acima do conteúdo */
  color: #333;
  /* Cor do texto (ajuste conforme necessário) */
  font-size: 30px;
  /* Ajuste o tamanho da fonte conforme necessário */
  font-weight: bold;
  /* Adicione peso à fonte se necessário */
}

.text {
  position: absolute;
  z-index: 3;
  /* Certifica-se de que o texto fique acima do conteúdo */
  text-align: center;
  color: #333;
  /* Cor do texto (ajuste conforme necessário) */
  font-size: 18px;
  /* Ajuste o tamanho da fonte conforme necessário */
  font-weight: bold;
  /* Adicione peso à fonte se necessário */
  top: 70px;
  /* Ajusta o espaço acima da div, ajuste conforme necessário */
  left: 10px;
  /* Adiciona um espaço na lateral esquerda */
  right: 10px;
  /* Adiciona um espaço na lateral direita */
  margin: 0 10px;
  /* Adiciona uma margem pequena nas laterais */
  box-sizing: border-box;
  /* Inclui padding e border no cálculo da largura e altura */


}

.cards-container {
  display: flex;
  gap: 20px;
  /* Espaçamento entre os cartões, ajuste conforme necessário */
  flex-wrap: wrap;
  /* Permite que os cartões se movam para a linha seguinte em telas menores */
  justify-content: center;
  
}


@keyframes blob-bounce {
  0% {
    transform: translate(-100%, -100%) translate3d(0, 0, 0);
  }

  25% {
    transform: translate(-100%, -100%) translate3d(100%, 0, 0);
  }

  50% {
    transform: translate(-100%, -100%) translate3d(100%, 100%, 0);
  }

  75% {
    transform: translate(-100%, -100%) translate3d(0, 100%, 0);
  }

  100% {
    transform: translate(-100%, -100%) translate3d(0, 0, 0);
  }
}




footer {
  background-color: #a8766d;
  /* Cor de fundo alterada */
  color: rgb(0, 0, 0);
  padding: 20px 0;
  text-align: left;
}

/* From Uiverse.io by asgardOP */
.button {
  cursor: pointer;
  width: 50px;
  height: 50px;
  border-radius: 50px;
  border: none;
  background: linear-gradient(120deg, #02ff2c, #008a12);
  position: relative;
  z-index: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 10px;
  transition: 0.1s;
}

.button svg {
  color: white;
  width: 30px;
  height: 30px;
  z-index: 9;
}

.button:nth-child(3) {
  background: linear-gradient(120deg, #02ff2c, #008a12);
}



.button:active {
  transform: scale(0.85);
}

.button::before {
  content: "";
  position: absolute;
  width: 55px;
  height: 55px;
  background-color: #a8766d;
  border-radius: 50px;
  z-index: -1;
  border: 0px solid rgba(255, 255, 255, 0.411);
  transition: 0.4s;
}

.button:hover::before {
  width: 0px;
  height: 0px;
}



.container {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.image-container {
  position: relative;
  text-align: center;
}

.image-container img {
  max-width: 70%;
  height: auto;
}

footer ul {
  list-style: none;

}

/* From Uiverse.io by Zameerahmad01 */
ul {
  list-style: none;
  text-align: left;
  justify-content: flex-start;
}

.example-2 {
  justify-content: flex-start;
  display: flex;

  align-items: left;
  flex-direction: column;
  row-gap: 0.5rem;
}

.example-2 .icon-content {
  margin: 0 10px;
  position: relative;
}

.example-2 .icon-content a {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: #4d4d4d;
  background-color: #fff;
  transition: all 0.3s ease-in-out;
}

.example-2 .icon-content a:hover {
  box-shadow: 3px 2px 45px 0px rgb(0 0 0 / 12%);
}

.example-2 .icon-content a svg {
  position: relative;
  z-index: 1;
  width: 30px;
  height: 30px;
}

.example-2 .icon-content a:hover {
  color: white;
}

.example-2 .icon-content a .filled {
  position: absolute;
  top: auto;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: #000;
  transition: all 0.3s ease-in-out;
}

.example-2 .icon-content a:hover .filled {
  height: 100%;
}

.example-2 .icon-content a[data-social="linkedin"] .filled,
.example-2 .icon-content a[data-social="linkedin"]~.tooltip {
  background-color: #25D366;
}

.example-2 .icon-content a[data-social="instagram"] .filled,
.example-2 .icon-content a[data-social="instagram"]~.tooltip {
  background: linear-gradient(45deg,
      #405de6,
      #5b51db,
      #b33ab4,
      #c135b4,
      #e1306c,
      #fd1f1f);
}

.example-2 .icon-content a[data-social="youtube"] .filled,
.example-2 .icon-content a[data-social="youtube"]~.tooltip {
  background-color: #ff2a2a;
}

.tooltip2 {
  display: flex;
  align-items: center;
  /* Alinha verticalmente ícone e texto */
  background-color: #a8766d;
  color: #32373c;
  padding: 6px 10px;
  font-size: 20px;
  white-space: nowrap;
  /* Evita quebra de linha no tooltip */

}

.icon-content {
  display: flex;
  align-items: center;
  /* Garante que o ícone e o texto fiquem lado a lado */
}

footer h3 {
  text-align: center;
  color: #32373c;
  font-size: 14px;
}

/* Media Queries para responsividade */
@media (max-width: 1024px) {
  .intro-content {
    flex-direction: column-reverse;
    text-align: center;
  }

  .intro-image {
    width: 90%;
    margin: 0 auto;
    padding: 30px;
  }

  .intro {
    background-image: url('fundo_text.jpeg');
    /* Cor de fundo da seção */
    color: #3f3538;
    /* Cor do texto */
    padding: 0px;
    /* Espaçamento interno da seção */

  }

  footer h3 {
    text-align: center;
    color: #32373c;
    font-size: 5px;
  }
  
}

@media (max-width: 768px) {
  nav .nav-list {
    flex-direction: column;
    gap: 10px;
  }

  button {
    padding: 10px 20px;
    font-size: 14px;
  }

  .services {
    flex-direction: column;
  }

  footer h3 {
    text-align: center;
    color: #32373c;
    font-size: 5px;
  }

  .intro {
    background-image: url('fundo_text.jpeg');
    /* Cor de fundo da seção */
    color: #3f3538;
    /* Cor do texto */
    padding: 0px;
    /* Espaçamento interno da seção */

  }

  .intro-image {
    width: 80%;
    margin: 0 auto;
    padding: 30px;
  }
}

@media (max-width: 480px) {

  header,
  nav {
    flex-direction: column;
  }

  .intro-content {
    padding: 20px;
  }

  .img_some {
    display: none;
    /* Esconde a imagem com a classe img_some em telas menores que 480px */
  }

  .intro {
    background-image: url('fundo_text.jpeg');
    /* Cor de fundo da seção */
    color: #3f3538;
    /* Cor do texto */
    padding: 0px;
    /* Espaçamento interno da seção */

  }

  .intro-image {
    width: 80%;
    margin: 0 auto;
    padding: 30px;
  }

  footer h3 {
    text-align: center;
    color: #32373c;
    font-size: 5px;
  }
}

.card2 {
  position: relative;
  margin: 0 auto; /* Centraliza horizontalmente */
  border-radius: 14px;
  z-index: 1111;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 20px;
  box-shadow: 20px 20px 60px #bebebe, -20px -20px 60px #bebebe;
  gap: 10px;
  width: 90%; /* Ajuste conforme necessário para manter espaço nas laterais */
}

.text2 {
  font-size: 18px; /* Ajuste o tamanho da fonte conforme necessário */
  font-weight: bold; /* Adiciona peso ao texto */
  margin-bottom: 10px; /* Espaçamento inferior */
  text-align: left; /* Alinha o texto à esquerda */
  width: 100%; /* O texto ocupa toda a largura do card */
}

.text3 {
  width: 90%; /* O card ocupará toda a largura disponível */
  margin-left: 50px; /* Ajuste esse valor conforme necessário */
  font-size: 18px; /* Ajuste o tamanho da fonte conforme necessário */
  font-weight: bold; /* Adiciona peso ao texto */
  margin-bottom: 10px; /* Espaçamento inferior */
  text-align: left; /* Alinha o texto à esquerda */
}

.card3 {
    position: relative;
    margin: 0 auto; /* Centraliza horizontalmente */
    border-radius: 14px;
    z-index: 1111;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px;
    gap: 10px;
    width: 80%; /* Ajuste conforme necessário para manter espaço nas laterais */
    text-align: center;
}

.text2 {
  position: absolute;
  z-index: 3;
  /* Certifica-se de que o texto fique acima do conteúdo */
  text-align: center;
  color: #333;
  /* Cor do texto (ajuste conforme necessário) */
  font-size: 18px;
  /* Ajuste o tamanho da fonte conforme necessário */
  font-weight: bold;
  /* Adicione peso à fonte se necessário */
  top: 20px;
  /* Ajusta o espaço acima da div, ajuste conforme necessário */
  left: 10px;
  /* Adiciona um espaço na lateral esquerda */
  right: 10px;
  /* Adiciona um espaço na lateral direita */
  margin: 0 10px;
  /* Adiciona uma margem pequena nas laterais */
  box-sizing: border-box;
  /* Inclui padding e border no cálculo da largura e altura */
}

.text4 {
 width: 90%; /* O card ocupará toda a largura disponível */
 margin-left: 50px; /* Ajuste esse valor conforme necessário */
 text-align: justify;
 top: 20px;
 /* Ajusta o espaço acima da div, ajuste conforme necessário */
 left: 10px;
 /* Adiciona um espaço na lateral esquerda */
 right: 20px;
 /* Adiciona um espaço na lateral direita */
 margin: 0 10px;
 /* Adiciona uma margem pequena nas laterais */
}

.degrade {
  background: linear-gradient(to bottom, #ffffff, #b3908a, #a8766d);
  padding: 25px;
  margin-left: calc(-50vw + 50%); /* Remove qualquer margem do container pai */
  margin-right: calc(-50vw + 50%); /* Remove qualquer margem do container pai */
  margin-bottom: -90px; /* Pode ajustar conforme necessário */
}