@media (max-width: 769px) {
  .about-section .row {
    display: flex;
    flex-direction: column-reverse !important; /* Cambia la dirección de los elementos a columna inversa */
  }
  .about-section .col-md-6 {
    text-align: center; /* Centra el texto en pantallas pequeñas */
  }
  .about-section p {
    text-align: justify;
    padding: 3vw;
  }
  .text-list {
    padding: 0vw !important;
  }
  .about-info {
    padding-top: 7vw;  
    }
  .container-list {
    padding: 3vw;
  }
  .material-gray {
    height: 25vw !important;
  }
} 

  .about-section .fade-in {
    opacity: 0; /* Inicialmente invisible */
    transform: translateY(20px); /* Desplazado hacia abajo */
    transition: opacity 0.8s ease-out, transform 0.8s ease-out; /* Transiciones suaves */
  }

  .about-section .fade-in.visible {
    opacity: 1; /* Visibilidad completa */
    transform: translateY(0); /* Regresa a su posición original */
  }

  .about-section img {
    transition: transform 0.3s ease; /* Transición suave para el aumento */
  }

  .about-section .border-img1-2  {
    transition: transform 0.3s ease; /* Transición suave para el aumento */
  }

  .about-section img:hover {
    transform: scale(1.1); /* Aumentar tamaño al pasar el mouse */
  }

  .about-section div.text-section:hover {
    transform: scale(1.1); /* Aumentar tamaño al pasar el mouse */
  }

  p.fade-in.visible:hover {
    transform: scale(1.1); /* Aumentar tamaño al pasar el mouse */
    color: #c29d52;
  }

  div.list.fade-in.visible:hover {
    transform: scale(1.1); /* Aumentar tamaño al pasar el mouse */
    color: #c29d52;
  }

  .about-section img {
    transition: transform 0.3s ease; /* Transición suave para el aumento */
  }

  .about-section img:hover {
    transform: scale(1.1); /* Aumentar tamaño al pasar el mouse */
  }

  #serviceCarousel .carrusel-img img {
    max-height: 400px;
  }
  #serviceCarousel .carrusel-img {
    padding-right: 5vw;
  }
  #serviceCarousel .carousel-inner h2 {
    font-size: 36px;
  }
  #serviceCarousel .carousel-item {
    min-height: 629px;
  }

  .carrusel-nav {
    position: absolute;
    top: 50%;
    width: 100%;
    display: flex;
    justify-content: space-between;
    transform: translateY(-50%);
  }
  .izquierda,
  .derecha {
    cursor: pointer;
  }
  .izquierda {
    position: absolute;
    left: 10vw;
  }
  .derecha {
    position: absolute;
    right: 10vw;
  }