.hero-wrap {

  background-size: cover;
  height: 30vh;
  position: relative;
}

.overlay::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(49, 81, 75, 0.6); /* Color de fondo semi-transparente */
  z-index: 0; /* Asegura que el fondo esté detrás del contenido */
}




.titulo {
  color: white;
  font-size: 2rem;
  z-index: 1; /* Asegura que el título esté en frente */
}


          
  @media (max-width: 1199.98px) {
    .hero-wrap {
      background-position: center center !important; } }

    @media (max-width: 991.98px) {
      .hero-wrap .slider-text h1 {
        font-size: 40px; } }


        @media (max-width: 708.00px) {
          .hero-wrap {

            height: 15vh;
            font-size: 10px; 
          
          } }