
body {
  overflow-x: hidden; /* Evita la barra horizontal */
  margin: 0; /* Elimina cualquier margen global */
}


.hero {
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5));
  background-size: cover;
  color: white;
  text-align: center;
  padding: 70px 0; /* Mantiene el padding corregido */
  position: relative;
  height: 500px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden; /* Evita desbordamientos */
  width: 100vw; /* Asegura que no haya margen extra */
}

.carousel {
  max-width: 100%;
  height: 100%;
}

.carousel-inner {
  height: 100%;
}

.carousel-item img {
  max-height: 100%;
  width: auto;
  height: auto;
  max-width: 100%;
  display: block;
  margin: auto;
}
/* Navbar fija debajo del carrusel */
.custom-navbar {
  position: sticky;
  top: 0;
  width: 100%;
  z-index: 999;
  background-color: #343a40; /* Color oscuro */
  padding: 0;
  text-align: center;
}

/* Enlaces de la navbar */
.custom-navbar .nav-link {
  color: white;
  font-size: 16px;
  font-weight: 500;
  padding: 10px 12px;
  text-decoration: none;
  transition: color 0.3s ease-in-out;
}

/* Hover en los enlaces */
.custom-navbar .nav-link:hover {
  color: #f8d210; /* Amarillo suave */
}
.no-style-link {
  all: unset; /* Elimina todos los estilos */
  cursor: pointer; /* Mantiene el cursor de enlace */
}
/*-------------- FIN INDEX -------------------------*/


.hero_service {
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../img/Egarian/service.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: white;
  text-align: center;
  padding: 80px 0;
  position: relative;
  height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.hero_contact {
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../img/Egarian/contact.webp');
  background-size: cover; /* Asegura que la imagen cubra todo el contenedor */
  background-position: center center; /* Centra la imagen */
  background-repeat: no-repeat;
  width: 100vw; /* Ocupar todo el ancho de la pantalla */
  max-width: 100%;
  color: white;
  text-align: center;
  padding: 80px 0;
  position: relative;
  height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}


.hero_purchase {
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url('../img/Egarian/purchase.webp');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: white;
  text-align: center;
  padding: 80px 0;
  position: relative;
  height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.next_link {
  display: inline-block;
  font-size: 14px; /* Tamaño más compacto */
  font-weight: 500;
  color: #007bff; /* Azul moderno */
  text-decoration: none;
  padding: 6px 12px;
  border: 1.5px solid #007bff;
  border-radius: 20px;
  transition: all 0.3s ease-in-out;
}

.next_link:hover {
  background-color: #007bff;
  color: white;
  transform: scale(1.03);
  box-shadow: 0px 2px 6px rgba(0, 123, 255, 0.2);
}

.navbar .nav-link {
  color: rgba(255, 223, 0, 0.8); /* Amarillo opaco */
  font-weight: 500;
  transition: color 0.3s ease-in-out;
}

.navbar .nav-link:hover {
  color: white; /* Color blanco al pasar el mouse */
}

.list-unstyled {
  text-align: left; /* Alinea el texto a la derecha */
  padding-right: 0; /* Elimina cualquier padding extra */
}


.response_message {
  display: none;
  text-align: center;
  padding: 20px;
  border-radius: 10px;
  background: #d4edda;
  color: #155724;
  margin-top: 20px;
}

.contact-info {
  background: #f8f9fa;
  padding: 20px;
  border-radius: 10px;
  margin-bottom: 20px;
}

/*------------------- PLANES ------------------------*/
/* Estilo para la sección de límites */
.plan-limits {
  background-color: rgba(0, 123, 255, 0.05); /* Fondo sutil */
  padding: 8px;
  border-radius: 8px;
  margin-top: 10px;
  font-size: 14px;
}

/* Alinear la palabra "Límites" a la izquierda */
.limits-title {
  font-weight: 600;
  color: #007bff; /* Azul para resaltar el título */
  display: block;
  text-align: left; /* Alinea la palabra Límites a la izquierda */
  margin-bottom: 5px;
  padding-left: 5px;
}

.plan-limits ul {
  padding-left: 0;
}

.plan-limits li {
  font-size: 13px;
  color: #666; /* Texto más tenue para diferenciar */
  padding: 2px 0;
  text-align: left; /* Mantiene la alineación de los límites */
}

/* Estilo para los sub-items (límites de cada función) */
.sub-limit {
  list-style: none;
  font-size: 12px; /* Letra más pequeña */
  color: #777; /* Color tenue para no competir con la info principal */
  padding-left: 20px; /* Alineación elegante */
  margin-top: 3px;
}

.sub-limit li {
  display: flex;
  align-items: center;
}

.sub-limit i {
  margin-right: 5px; /* Espaciado del ícono */
  color: #007bff; /* Azul sutil para resaltar */
}

/* Estilo base del precio */
.plan-price {
  padding: 8px;
  border-radius: 8px;
  font-size: 24px;
  font-weight: bold;
  text-align: center;
  margin-bottom: 10px;
}

.plan-price-iva {
  font-size: 14px; /* Tamaño reducido para "+ IVA / mes" */
  vertical-align: middle; /* Alinear con el precio */
}

/* Variantes de color */
.price-blue {
  background-color: rgba(0, 123, 255, 0.1); /* Fondo azul */
  color: #007bff;
}

.price-green {
  background-color: rgba(40, 167, 69, 0.1); /* Fondo verde */
  color: #28a745;
}

.price-yellow {
  background-color: rgba(255, 193, 7, 0.1); /* Fondo amarillo */
  color: #ffc107;
}

.price-red {
  background-color: rgba(220, 53, 69, 0.1); /* Fondo rojo */
  color: #dc3545;
}


/*----------------------- FIN PLANES ----------------------*/