@import url("componentes.css");

.u-section-2,
.u-section-3,
.u-section-4,
.u-section-5,
.u-section-6,
.u-section-7,
.u-section-8 {
  background: #f6f7f6;
}

.u-section-2 .u-sheet-1,
.u-section-3 .u-sheet-1,
.u-section-4 .u-sheet-1,
.u-section-5 .u-sheet-1,
.u-section-6 .u-sheet-1,
.u-section-7 .u-sheet-1,
.u-section-8 .u-sheet-1 {
  padding: 70px 0;
}

.sh-dark {
  background: radial-gradient(120% 120% at 70% 20%, #0f2c2f 0%, #0b1b1f 55%, #091417 100%);
  color: #f7faf8;
}

#service-hub-environments .sh-image-wide {
  margin-top: 32px;
}

.mos-page .sh-benefits-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.mos-page .sh-benefit h3 {
  color: #4fd691;
}

.sh-feature h3 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
}

.sh-feature-icon {
  background: rgba(53, 185, 116, 0.12);
}

.sh-feature-icon svg {
  fill: var(--sh-green-dark);
}

#soluciones-mic .u-sheet-1 {
  padding-top: 42px;
  padding-bottom: 42px;
}

@media (max-width: 991px) {
  .mos-page .sh-cover {
    grid-template-columns: 1fr !important;
    padding: 48px 0 40px;
  }

  .mos-page .sh-grid-two,
  .mos-page .sh-benefits-grid,
  .mos-page .sh-features-grid {
    grid-template-columns: 1fr !important;
  }

  .mos-page .sh-title {
    font-size: 2.4rem;
  }

  .mos-page .sh-subtitle {
    font-size: 1.6rem;
  }
}

@media (max-width: 767px) {
  .mos-page .sh-cover {
    gap: 28px;
    padding: 36px 0 32px;
  }

  .mos-page .sh-title {
    font-size: 2rem;
  }

  .mos-page .sh-subtitle {
    font-size: 1.3rem;
  }
}
