/* =========================================================
   HOME FIX (2026-02-18) — Suscríbete + Nuestros Servicios
   - Asegura el estilo original aunque el appbusiness.css sea distinto
   - Tarjetas de servicios con icono grande
   - Caja "Suscríbete" con cabecera en punta + inputs con iconos
   - Hover/animación suave + barra roja bajo el título
   ========================================================= */

/* Bloque Servicios */
.servicios{ overflow:hidden; }
.servicios a, .servicios a:hover{ color:#FFFFFF; text-decoration:none; }

/* Título con barra */
.title-section{
  font-size:30px;
  font-weight:bold;
  border-bottom:1px solid #eee;
  margin-bottom:10px;
}
.title-section span{
  display:block;
  border-bottom:3px solid #A71931;
  width:70px;
  padding-bottom:10px;
  transform-origin:left center;
  animation: titlebarLoad .9s ease-out both;
}
@keyframes titlebarLoad{
  from{ transform:scaleX(0); }
  to{ transform:scaleX(1); }
}

/* Caja suscripción */
.inscripcion{
  background:#fff;
  box-shadow:0 5px 5px rgba(0,0,0,.35);
}
.inscripcion-header{
  background:#A71931;
  z-index:1;
  height:80px;
}
.inscripcion-title{
  margin:0;
  padding:20px 0 0;
  font-weight:bold;
  color:#FFFFFF;
  text-align:center;
  line-height:1.1;
}
.inscripcion-title span{
  display:block;
  padding-top:8px;
  font-size:30px;
}

/* Punta */
.inscripcion-footer{
  width:100%;
  height:0;
  padding-left:50%;
  padding-bottom:100px;
  overflow:hidden;
  margin-top:-50px;
  z-index:0;
}
.inscripcion-footer:after{
  content:"";
  display:block;
  width:0;
  height:0;
  margin-left:-500px;
  border-left:500px solid white;
  border-right:500px solid white;
  border-top:100px solid #A71931;
}

/* Form con iconos */
.form-app{
  padding:30px 20px 40px;
  background:#FFFFFF;
}
.form-app label{
  position:relative;
  width:100%;
  margin:0;
}
.form-app i{
  position:absolute;
  top:8px;
  left:0;
  font-size:22px;
  color:#A71931;
  text-align:center;
  width:30px;
}
.form-app input{
  margin-bottom:10px;
  border:0;
  border-bottom:1px solid #e5e5e5;
  font-weight:400;
  font-style:italic;
  color:#3C3C3B;
  font-size:16px;
  padding:10px 45px;
  width:100%;
  border-radius:0;
}
.form-app input:hover{
  border-bottom:1px solid #A71931;
  transition:border-bottom .5s;
}
.btn-inscripcion{
  background:#A71931;
  color:#FFFFFF;
  font-weight:bold;
  font-size:16px;
  border-radius:0;
  border:0;
}
.btn-inscripcion:hover,.btn-inscripcion:active,.btn-inscripcion:focus{
  background:#3C3C3B;
  color:#FFFFFF;
  outline:none;
  transition:background 1s;
}

/* Tarjetas de servicios */
.item{
  padding:30px 10px;
  position:relative;
  color:#fff;
  margin-bottom:10px;
  height:145px;
  border:3px solid #fff;
  box-shadow:0 5px 5px rgba(0,0,0,.35);
  transition:transform .25s ease, box-shadow .25s ease;
}
.item:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 14px rgba(0,0,0,.35);
}
.item h4{
  margin:18px 0 6px;
  text-align:center;
  font-size:26px;
  font-weight:bold;
}
.item p{
  margin:0;
  text-align:center;
  font-size:15px;
  opacity:.95;
}
.item i{
  color:#000;
  font-size:60px;
  position:absolute;
  right:5%;
  bottom:10%;
  opacity:0.22;
}

/* Colores fijos como la web original */
.item-color1{ background:#198ECE; }
.item-color2{ background:#A71931; }
.item-color3{ background:#3C3C3B; }

/* Botón buscar más similar (por si bootstrap fue sobreescrito) */
.form-search .btn.btn-danger{
  background:#A71931;
  border-color:#A71931;
  border-radius:0;
}
.form-search .btn.btn-danger:hover{
  background:#3C3C3B;
  border-color:#3C3C3B;
}