@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,400;0,700;1,900&display=swap);
.background{background-color:#000;height:100vh;width:100%}

.content-main{text-align:center;font-family:Poppins,sans-serif;padding-top: 170px;}
.content-main h1{color:#fff;font-size:80px}
.degres{background:linear-gradient(white,#ff5e00);-webkit-background-clip:text;color:transparent;font-weight:400;font-size:25px}
.imgs{display:flex;flex-direction:row;width:100%;justify-content:center}
.imgs .img-index img{max-width:25vw}
.btn-cont{margin-top:-220px}
.tvco-btn{border:0;border-radius:25px;background-color:#ff5e00;border:solid 3px #ff7322}
.tvco-btn:hover{background-color:#000;border:solid 3px #ff5e00;color:#fff;transition:.5s}
.tvco-btn p{margin:0;color:#fff;font-family:Poppins,sans-serif;font-weight:lighter;padding:5px 30px 5px 30px;font-size:25px}
.sliderPage{height:100vh}
.slider-item h1{color:#000;font-family:Poppins,sans-serif;font-weight:600;padding:5px 30px 5px 30px;font-size:35px}
.slider-item h5{color:#000;font-family:Poppins,sans-serif;font-weight:regular;padding:5px 30px 5px 30px;font-size:25px}
.slider-item img{width:400px}
.titles{text-align:center;margin-top:100px;margin-bottom:14px}
.titles h1{font-family:Poppins,sans-serif;font-weight:700;margin:0 100px;font-size:45px}
.colored{background-color:#ffb350}
.lineas{background-color:#ff5e00;padding:4px;width:50%}
.services{margin-top:40px!important;margin-bottom:50px}
.services .item-service{display:flex;flex-direction:row;width:25%}
.services .item-service h3{color:#000;font-family:Poppins,sans-serif;font-weight:600;padding:5px 30px 5px 30px;font-size:20px;margin:0!important;padding:0;float:left}
.services .item-service h5{color:#000;font-family:Poppins,sans-serif;font-weight:regular;padding:5px 30px 5px 30px;font-size:16px;margin:0!important;padding:0;float:left}
.services .item-service img{width:100px;float:right}
.swiper{margin:0;background-color:#fff;width:80%;height:350px;margin:30px 0}
.swiper:hover{cursor:grab}
.zoom{overflow:hidden;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;-o-transition:all .2s ease-in-out;-ms-transition:all .2s ease-in-out;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;min-height:345px;max-height:345px}
.border{display:block;position:relative;color:#fff}
.border:hover{filter:saturate(0);color:#000}
.border h5{color:#fff;font-family:Poppins,sans-serif;font-weight:light;font-size:15px;position:absolute;top:40px;left:25px}
.border h1{color:#fff;font-family:Poppins,sans-serif;font-weight:light;font-size:35px;position:absolute;top:60px;left:25px}
.border P{color:#fff;font-family:Poppins,sans-serif;font-weight:bolder;font-size:80px;position:absolute;top:140px;left:50px;opacity:.7}
.border img{width:70%;position:absolute;top:65px;right:-65px;transform:rotate(10deg)}
.color1{background:linear-gradient(to right,#ff6200,#ff8e3d);-webkit-background-clip:content-box;filter:saturate(1.4)}
.color2{background:linear-gradient(to right,red,#ff5656);-webkit-background-clip:content-box;filter:saturate(1.4)}
.color3{background:linear-gradient(to right,#00b4ff,#67fff0);-webkit-background-clip:content-box;filter:saturate(1.4)}
.color4{background:linear-gradient(to right,#00ff18,#66fb6e);-webkit-background-clip:content-box;filter:saturate(1.4)}
.color5{background:linear-gradient(to right,#9600ff,#b273ff);-webkit-background-clip:content-box;filter:saturate(1.4)}
.cont-review{margin:0!important;padding:0!important}
.review{background-color:#fff;margin:10px 15px!important;padding:40px!important;border-radius:20px;position:relative;height:430px}
.review .comilla{color:#ff5e00;font-size:100px;font-family:sans-serif;font-weight:700;position:absolute;top:10px;left:30px}
.review h5{color:#000;font-size:20px;font-family:Poppins,sans-serif;font-weight:500;position:absolute;top:20px;left:50px;padding:inherit}
.review .review-img{border-radius:500px;overflow:hidden;width:75px;position:absolute;top:295px}
.review h1{position:absolute;top:295px;left:130px;color:#000;font-size:25px}
.review .stars{position:absolute;top:325px;left:130px;color:#f3c019;font-size:18px}
.contact{height:1000px;background-image:url(../img/img-Index/contacto-background.png);background-size:cover;color:#fff;position:relative;overflow:hidden;background-position: right;}
.contact h1{color:rgb(0, 0, 0);font-family:Poppins,sans-serif;font-weight:bolder;font-size:80px;position:absolute;top:210px;left:50px;-webkit-text-stroke:2px #fff}
.contact p{color:#fff;font-family:Poppins,sans-serif;font-weight:light;font-size:15px;position:absolute;top:300px;left:70px}
.contact .contact_inputs{position:absolute;top:350px;left:80px}
.contact .contact_labels{position:absolute;top:350px;left:20px}
.contact input{border:none;height:45px;margin:10px 20px;padding:10px}
.contact textarea{border:none;margin:10px 20px;padding:10px;width:72%}
.contact .imgs{display:inline-block;position:absolute;right:0;width:26%}
.contact .imgs img{filter:drop-shadow(0 0.5px 2px white)}
.contact .imgs #brazo{position:absolute;top:100px;right:10px}
.contact .imgs #brazo img{transform:scaleX(-1);width:400px}
.contact .imgs #fijo{position:absolute;top:320px;right:300px}
.contact .imgs #fijo img{transform:rotate(-15deg);width:350px}
.contact .imgs #pedestal{position:absolute;top:420px;right:10px}
.contact .imgs #pedestal img{transform:rotate(25deg);width:500px}
.contact .logomain{position:absolute;top:40px;left:18%;opacity:1}
.contact .logomain img{width:150px}
.contact .botonera{width:72%;text-align:center}
.contact .botonera button{width:40%;height:60px;margin:0;color:#fff;font-family:Poppins,sans-serif;font-weight:lighter;padding:5px 30px 5px 30px;font-size:25p}
footer {
    background-color: #000;
}
@media screen and (max-width:1624px){
.imgs .img-index img{max-width:27vw}
}
@media screen and (max-width:1440px){
.logo{left:5%}
.navbar-index{width:100%;height:120px;margin:auto;display:flex;align-items:center;text-align:center}
.btn-cont{width:100%!important;margin-top:-130px!important}
.review{background-color:#fff;margin:10px 15px!important;padding:40px!important;border-radius:20px;position:relative;height:350px}
.review h5{color:#000;font-size:15px;font-family:Poppins,sans-serif;font-weight:500;position:absolute;top:20px;left:50px;padding:inherit}
.review .review-img{border-radius:500px;overflow:hidden;width:65px;position:absolute;top:205px}
.review h1{position:absolute;top:205px;left:130px;color:#000;font-size:20px}
.review .stars{position:absolute;top:230px;left:130px;color:#f3c019;font-size:15px}

}
@media screen and (max-width:1200px){
.logo{width:75px!important;top: 2px;}
.imgs .img-index img{max-width:30vw}
.btn-cont{margin-top:0}
.tvco-btn p{font-size:20px}

.menu{height:60px}
.btn_menu{display:inline-flex}
.menu{justify-content:flex-end;color:#fff}
.menu_items{position:fixed;width:100vw;height:calc(100% - 40px);background-color:rgba(0,0,0,.74);top:0;text-align:center;transition:all .4s;flex-direction:column;padding:0!important;margin-right:0;transform:scale(0)}
.menu_items li{margin:30px 0 0 0;line-height:30px}
.menu_items li:hover{background-color:rgba(34,34,34,.568)}
.menu_items li a{font-size:20px;color:#fff;font-weight:700}
.menu_items li a:hover{color:#000}
.carousel-item{background-color:#000000d9!important}
.services .item-service{width:50%;text-align:left}
.services .item-service h3{float:left}
.services .item-service h5{float:left}
.services .item-service img{float:right}
.border h5{top:40px;left:25px}
.border h1{top:60px;left:25px;font-size:25px}
.border P{top:140px;left:20px;opacity:.7}
.border img{top:95px;right:-65px}
.review{background-color:#fff;margin:10px 15px!important;padding:40px!important;border-radius:20px;position:relative;height:450px}
.review h5{color:#000;font-size:15px;font-family:Poppins,sans-serif;font-weight:500;position:absolute;top:20px;left:50px;padding:inherit}
.review .review-img{border-radius:500px;overflow:hidden;width:65px;position:absolute;top:295px}
.review h1{position:absolute;top:295px;left:110px;color:#000;font-size:20px}
.review .stars{position:absolute;top:320px;left:110px;color:#f3c019;font-size:15px}
.contact #fijo{display: none;}
.contact #brazo{display: none;}
.contact #pedestal{display: none;}
.contact .botonera{width:100%;text-align:center}
}
@media screen and (max-width:900px){
.content-main h1{color:#fff;font-size:8vw}
.btn-cont button{margin-top:25px;width:50%}
.contact{text-align:center}
.contact h1{font-size:60px ;left: 19%;top:140px ;}

}
@media screen and (max-width:950px){
.cont-review{width:50%!important;margin:auto!important}
}
@media screen and (max-width:766px){
.content-main h1{color:#fff;font-size:7vw}
#brazo{display:none}
#pedestal{display:none}
#fijo img{max-width:40vw!important}
.titles h1{margin:0}
.services .item-service h3{float:none;margin:auto}
.services .item-service h5{float:none;margin:auto}
.services .item-service img{float:none;margin:auto}
.swiper{width:80%}
.cont-review{width:80%!important;margin:auto!important}
.contact h1{font-size:60px ;left: 10%;top:140px ;}
.contact .contact_inputs {left:0px}
.contact h1{font-size:50px;left:0px}
.contact p{left: 10px;}
}
@media screen and (max-width:634px){
#fijo img{max-width:60vw!important}
.btn-cont button{width:70%}
.cont-review{width:90%!important;margin:auto!important}
.review h5{color:#000;font-size:18px;font-family:Poppins,sans-serif;font-weight:500;position:absolute;top:20px;left:50px;padding:inherit}
.review{height:400px}
.contact h1{top:100px ;}
.contact .contact_inputs {top: 280px;}
.contact h1{font-size:50px;left:0px}
.contact p{top: 220px;}

}
@media screen and (max-width:425px){
#fijo img{max-width:100vw!important}
.btn-cont button{width:100%!important}
.btn-cont p{font-size:16px}
.services .item-service{min-width:100%;text-align:-webkit-center;margin-bottom:50px}
.services .item-service h5{padding:0 50px}
.swiper{min-width:100%}
.review h5{color:#000;font-size:16px;font-family:Poppins,sans-serif;font-weight:500;position:absolute;top:20px;left:50px;padding:inherit}
.cont-review{width:100%!important;margin:auto!important}
.review{padding:10px}
.contact .contact_inputs input{width: 75%;}
.contact h1{font-size:45px;left:0px}
.contact .botonera button{width:90%}
}

.wa-float-left {
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 1000;
}

.wa-float-left img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  transition: transform 0.3s ease;
}

.wa-float-left img:hover {
  transform: scale(1.1);
}

.myButtonWA {
  display: inline-block;
  background-color: #25D366; /* Color oficial de WhatsApp */
  color: #fff;
  padding: 10px 20px;
  border-radius: 50px;
  font-size: 1em;
  text-decoration: none;
  font-weight: bold;
  box-shadow: 0 4px 18px rgba(37, 211, 102, 0.2);
  position: relative;
  animation: pulse 1.2s infinite;
  transition: box-shadow 0.3s;
}
.myButtonWA:hover, .myButtonWA:focus {
  background-color: #128C7E;
  box-shadow: 0 8px 28px rgba(18, 140, 126, 0.3);
}
@keyframes pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.7);
  }
  70% {
    transform: scale(1.08);
    box-shadow: 0 0 0 16px rgba(37, 211, 102, 0.0);
  }
  100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.0);
  }
}

.enviando-mensaje {
  color: #e36415;
  background: #fff8e1;
  border: 2px solid #33ff4e;
  border-radius: 8px;
  padding: 8px 16px;
  margin: 10px 0 8px 0;
  font-size: 1.1em;
  display: flex;
  align-items: center;
  gap: 10px;
  justify-content: center;
}
.enviando-mensaje .fa-spinner {
  font-size: 1.2em;
}

.boton-envio { display: block; margin: 0 auto; }