/* ============================
   SOLUCIONES – Estilos
   ============================ */

/* Página */
.solutions-page {
  background-color: #f8fafc;
}

/* Hero */
.solutions-hero {
  background-color: #f1f5f9;
  text-align: center;
}

.solutions-hero .section-title {
  margin-bottom: 1rem;
}

.solutions-hero .section-lead {
  max-width: 46rem;
  margin: 0 auto;
  color: #4b5563;
}

/* Bloques de soluciones */
.solution-block {
  background-color: #ffffff;
}

.solution-block.solution-alt {
  background-color: #f8fafc;
}

.solution-kicker {
  font-size: 0.85rem;
  font-weight: 600;
  text-transform: uppercase;
  color: #4f46e5;
  margin-bottom: 0.4rem;
}

/* Títulos */
.solution-block .section-title {
  font-size: 1.45rem;
  font-weight: 650;
  margin-bottom: 0.8rem;
  color: #0f172a;
}

.solution-block .section-text {
  font-size: 0.95rem;
  color: #4b5563;
  margin-bottom: 0.65rem;
}

/* IMÁGENES */
.solution-image-wrapper {
  width: 100%;
  max-width: 620px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 1.4rem;
  overflow: hidden;
  box-shadow: 0 25px 70px rgba(15, 23, 42, 0.12);
}

.solution-image {
  width: 100%;
  height: 370px;
  object-fit: cover;
  display: block;
  border-radius: 1.4rem;
}

/* CTA Final */
.solutions-cta {
  background: radial-gradient(circle at top left, rgba(79, 70, 229, 0.22), transparent 55%),
              radial-gradient(circle at bottom right, rgba(34, 197, 94, 0.18), transparent 55%),
              #020617;
  color: #e5e7eb;
  text-align: center;
}

.solutions-cta .section-title {
  font-size: 1.55rem;
  color: #ffffff;
}

.solutions-cta .section-lead {
  max-width: 42rem;
  margin: 0 auto;
  color: #cbd5f5;
}

/* Responsive */
@media (max-width: 991.98px) {

  .solution-image {
    height: 300px;
  }

  .solution-block,
  .solution-block.solution-alt {
    text-align: center;
  }
}

@media (max-width: 767.98px) {

  .solutions-hero {
    padding-top: 4rem;
    padding-bottom: 3rem;
  }

  .solution-image-wrapper {
    max-width: 500px;
  }

  .solution-image {
    height: 260px;
  }
}
