
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');
@import url('https://fonts.googleapis.com/css?family=Raleway:300,400,700,900');

html{
	overflow-x: hidden!important; /*patch left*/
	font-family: 'Montserrat', sans-serif;
}


.titulo30_Y {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 23px;
  color: #dedede;
  line-height: 30px;
  letter-spacing: 1px;
}

.stitulo30_Y {
  color: #dedede;
  font-size: 14px;
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  line-height: 1.5;
  letter-spacing: 0px;
}

.parrafo_30_Y {
  color: #dedede;
  font-size: 16px;
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  line-height: 1.5;
}

.typox{
	  font-weight: 900!important;
}


.scroll{
  position:absolute;
  bottom:-150px;
  left:50%;
  transform:translateX(-50%);
  width:40px;
  height:40px;
  border-radius:50%;
  border:none;
  background:white;
  cursor:pointer;

 font-size:22px;
  font-family: 'Raleway', sans-serif;
  font-weight: 900;
  color:#ff0085;

}


.scroll{
  animation: mover 1.5s infinite;
}

@keyframes mover{
  0%{transform:translate(-50%,0);}
  50%{transform:translate(-50%,6px);}
  100%{transform:translate(-50%,0);}
}


.popup{
  height: 50px;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.5);
 position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);

   display: flex;
  justify-content: left;
  align-items: left;
  text-align: left;
  padding: 12px 20px;

   backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px); /* Safari */
  
  /* opcional para más efecto glass */
  border-radius: 0px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  opacity: 0;
    -webkit-transition: all 0.3s ease-out!important;

}

.pop_brand{
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 23px;
  color: #dedede;
  line-height: 30px;
  letter-spacing: 1px;
}

.pop_txt{
    color: #dedede;
  font-size: 18px;
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  line-height:  30px;
  letter-spacing: 0px;
}



@media only screen and (max-width: 767px) {


  .popup{
  height: auto;
  width: 100%;

     display: center;
  justify-content: center;
  align-items: center;
  text-align: center;
  padding: 12px 20px;


  }

  .pop_brand{
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 15px;
  color: #dedede;
  line-height: 16px;
  letter-spacing: 1px;
}

.pop_txt{
    color: #dedede;
  font-size: 15px;
  font-family: 'Raleway', sans-serif;
  font-weight: 300;
  line-height:  15px;
  letter-spacing: 0px;
}



}

.menu_book_contenedor {
  text-align: center;
  background-color:none;
  width: 100%;
}

.menu_book {
    display: flex;
    justify-content: center;
    padding: 20px;
}

.menu_book ul {
    list-style: none;
    display: flex;
    gap: 5vw;
    padding: 0;
    margin: 0;
}

.menu_book a {
    position: relative;
    display: inline-block;
    text-decoration: none;
    color: black;
   font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 2vw;
  line-height: 30px;
  letter-spacing: 1px;
}

.menu_book a::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 15px;
    width: 0;
    height: 2px;
    background-color: black;
    transition: width 1s ease;
}

.menu_book a:hover,
.menu_book a:focus,
.menu_book a:active {
    color: black !important;
     font-family: "Bebas Neue", sans-serif !important;
     font-weight: 400!important;
}

.menu_book a:hover::after {
    width: 100%;
}


@media (max-width: 768px){


  .menu_book {
    justify-content: flex-start;
    padding-left: 20px; /* opcional para respiración */
  }


  .menu_book ul {
    flex-direction: column; /* 🔥 pasa de horizontal a vertical */
    align-items: flex-start;    /* centra los elementos */
    gap: 5px;              /* espacio entre links */
  }


  .menu_book a {
    background-color: none;
    font-size: 5vw;
    line-height: 1.1;
    letter-spacing: 1px;
    height: auto;
    padding-bottom: 10px;
    padding-left: 0px;
    padding-right: 0px;
    padding-top: 0px;

  }

  .menu_book a {
    display: block;
    width: 100%;
    text-align: left; /* 🔥 asegura alineación */
    padding-left: 10px;
}

  .menu_book li {
    width: 100%;
  }

  .menu_book a::after {

    visibility: hidden;
    bottom: 10px;

  }




}


.plus1 {
color: #ffd500;
  font-size: 5vw;
  line-height: 130%;
  font-family: 'Bebas Neue', sans-serif;
  font-weight: 900;
}


.plus2 {
color: #ff0085;
  font-size: 5vw;
  line-height: 130%;
  font-family: 'Bebas Neue', sans-serif;
  font-weight: 900;
}


.plus3 {
color: #00adff;
  font-size: 5vw;
  line-height: 130%;
  font-family: 'Bebas Neue', sans-serif;
  font-weight: 900;
}


.plus4 {
color: #ffd500;
  font-size: 5vw;
  line-height: 130%;
  font-family: 'Bebas Neue', sans-serif;
  font-weight: 900;
}




@media (max-width: 768px){
  .plus1,.plus2,.plus3,.plus4 {
      font-size: 10vw;
      line-height: 130%;
      font-family: 'Bebas Neue', sans-serif;
      font-weight: 900;
    }
}







.carrusel{
  overflow: none;
  width: 100%;
  padding-top: 40px;
}

.track{
  display: flex;
  width: max-content;
  animation: scroll 70s linear infinite;
}

.track img{
  height: 4vw;
  margin-right: 60px; /* 🔥 usa margin en lugar de gap */
  flex-shrink: 0;
}

@keyframes scroll {
  from{
    transform: translateX(0);
  }
  to{
    transform: translateX(-50%);
  }
}


@media (max-width: 768px){


.carrusel{
  overflow: none;
  width: 100%;
  padding-top: 30px;
}

.track{
  display: flex;
  width: max-content;
  animation: scroll 70s linear infinite;
}

.track img{
  height: 16vw;
  margin-right: 60px; /* 🔥 usa margin en lugar de gap */
  flex-shrink: 0;
}

}


.titulo_clientes{
  padding-top: 30px;
  height: auto;
}