@media (max-width: 1299px) {
  .hero_area .hero_bg_box {
    top: 0;
    left: 0;
    width: 100%;
  }

}

@media (max-width: 1120px) {}

@media (max-width: 992px) {
  .hero_area {
    min-height: auto;
  }

  .slider_section .detail-box {
    margin-bottom: 45px;
  }

  .custom_nav-container .navbar-nav {
    padding-top: 15px;
    align-items: center;
  }

  .custom_nav-container .navbar-nav .nav-item .nav-link {
    padding: 5px 25px;
    margin: 5px 0;
  }

  .footer_section .footer_bg_box img {
    -o-object-position: 10% top;
    object-position: 10% top;
  }
}

@media (max-width: 767px) {

  .about_section .img-box {
    margin-bottom: 30px;
  }

  .contact_section .form_container {
    margin-bottom: 45px;
  }

  .client_section .box {
    margin: 45px 0;
  }

  .hero_area .hero_bg_box img {
    -o-object-position: center top;
    object-position: center top;
  }
}

@media (max-width: 576px) {}

@media (max-width: 480px) {
  .slider_section .detail-box h1 {
    font-size: 2rem;
  }

  .about_section {
    border-radius: 90px;
    padding-left: 10px;
    padding-right: 10px;
  }
}

@media (max-width: 420px) {}

@media (max-width: 376px) {}

@media (min-width: 1200px) {
  .container {
    max-width: 1170px;
  }
}


/* Esconde o elemento e define a transição */
.texto-animation-direita, .texto-animation-esquerda {
  opacity: 0; /* Inicialmente invisível */
  transition: opacity 1s ease, transform 1s ease; /* Suaviza a transição */
}

/* Movendo da direita para a posição original */
.texto-animation-direita {
  transform: translateX(100%);
}

/* Movendo da esquerda para a posição original */
.texto-animation-esquerda {
  transform: translateX(-100%);
}

/* Classe que ativa a animação */
.texto-animation-ativo {
  opacity: 1;
  transform: translateX(0);
}

#tratamento-image{
  animation: borda-animada 1s linear infinite alternate;
  border-color: #28a745;
}

@keyframes borda-animada {
  from{
    border: 10px solid #3498db;
  }
  to{
    border: 1px solid #3498db;
    border-radius: 50%;
  }
  
}

#barra {
  width: 30%;
  height: 8px;
  background-color: #3498db;
  position: absolute;
  animation: mover 1s linear infinite alternate;
}
@keyframes mover {
  from {
      left: 0;
  }
  to {
      left: 100%;
      transform: translateX(-100%);
  }
}

#anima-circle{
animation: pulse 4s ease-in-out infinite;
}

@keyframes pulse {
0% {
  transform: scale(1);
  opacity: 1;
}
50% {
  transform: scale(1.1);
  opacity: 0.8;
}
100% {
  transform: scale(1);
  opacity: 1;
}
}


  .card {
          background-color:#62d2a2ff;
          color: black;
          text-align: center;
          padding: 15px;
          border-radius: 10px;
      }
  .card:hover{
          background-color:green;
          color: white;
      }
  .grid-container {
          display: grid;
          grid-template-columns: repeat(3, 1fr);
          gap: 15px;
          justify-content: center;
          align-items: center;
     }
      .grid-container-2 {
          display: grid;
          grid-template-columns: repeat(2, 1fr);
          gap: 15px;
          justify-content: center;
          align-items: center;
          margin-bottom: 30px;
      }
      .atendimento-container {
          display: flex;
          justify-content: space-around;
          text-align: center;
          margin-top: 20px;
      }
    .info-list {
        background: #f8f9fa;
        border-radius: 8px;
        padding: 20px;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    }
    .info-item {
        display: flex;
        align-items: center;
        padding: 15px;
        border-bottom: 1px solid #dee2e6;
        transition: background 0.3s ease-in-out;
    }
      .info-item:last-child {
          border-bottom: none;
      }
    .info-item:hover {
        background: #e9ecef;
    }
    .info-icon {
        font-size: 24px;
        margin-right: 15px;
        width: 40px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        color: #fff;
    }
    .icon-red {
        background: #dc3545;
    }
    .icon-yellow {
        background: #ffc107;
    }
    .icon-green {
        background: #28a745;
    }
    .info-content {
        flex: 1;
    }
    .info-title {
        font-weight: 600;
        font-size: 18px;
        color: #343a40;
    }
    .info-text {
        font-size: 15px;
        color: #6c757d;
    }



    .up {
      opacity: 0;
      transform: translateY(50px);
      animation: mover 2s ease-out forwards;
  }

  @keyframes mover {
      from {
          opacity: 0;
          transform: translateY(50px);
      }
      to {
          opacity: 1;
          transform: translateY(0);
      }
  }