/* Loaded after style.css to lock the homepage stats band layout. */
.stats-band.stats-band {
  min-height: 0 !important;
  padding: 76px 0 78px !important;
  background:
    radial-gradient(circle at 4% 18%, rgba(255, 255, 255, 0.13) 0 0, rgba(255, 255, 255, 0.13) 145px, transparent 146px),
    radial-gradient(circle at 92% 86%, rgba(255, 255, 255, 0.11) 0 0, rgba(255, 255, 255, 0.11) 86px, transparent 87px),
    linear-gradient(135deg, #087cff 0%, #0064df 100%) !important;
}

.stats-band .shell {
  position: relative !important;
  z-index: 1 !important;
  width: min(calc(100% - 120px), 1180px) !important;
  max-width: 1180px !important;
  padding: 0 !important;
  overflow: visible !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.stats-band::before,
.stats-band::after,
.stats-pill,
.stats-avatar,
.stats-star {
  display: none !important;
  content: none !important;
}

.stats-band .shell::before,
.stats-band .shell::after {
  position: absolute !important;
  z-index: -1 !important;
  display: block !important;
  content: "" !important;
  pointer-events: none !important;
}

.stats-band .shell::before {
  right: -11% !important;
  top: 0 !important;
  width: 150px !important;
  height: 205px !important;
  border: 3px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 6px !important;
  transform: rotate(11deg) skewY(-13deg) !important;
}

.stats-band .shell::after {
  right: -10% !important;
  bottom: -24px !important;
  width: 205px !important;
  height: 156px !important;
  background-image: radial-gradient(rgba(255, 255, 255, 0.24) 1.2px, transparent 1.2px) !important;
  background-size: 12px 12px !important;
  opacity: 0.45 !important;
}

.stats-band h2 {
  max-width: 980px !important;
  margin: 0 auto !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: clamp(30px, 2.25vw, 42px) !important;
  font-weight: 900 !important;
  line-height: 1.14 !important;
  letter-spacing: 0 !important;
  text-shadow: 0 8px 22px rgba(0, 61, 153, 0.18) !important;
  white-space: normal !important;
}

.stats-band h2 span {
  color: #ffd22f !important;
}

.stats-band h2::after {
  display: none !important;
  content: none !important;
}

.stats-subcopy {
  max-width: 860px !important;
  margin: 22px auto 24px !important;
  color: rgba(255, 255, 255, 0.93) !important;
  font-size: clamp(16px, 1.18vw, 22px) !important;
  font-weight: 500 !important;
  line-height: 1.55 !important;
}

.stats-divider {
  display: grid !important;
  grid-template-columns: 78px auto 78px !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
  width: 260px !important;
  max-width: 44vw !important;
  margin: 0 auto 30px !important;
  color: rgba(255, 255, 255, 0.72) !important;
}

.stats-divider::before,
.stats-divider::after {
  content: "" !important;
  height: 1px !important;
  background: currentColor !important;
}

.stats-divider span {
  display: block !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1 !important;
}

.stats-grid {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  width: min(100%, 1060px) !important;
  max-width: 100% !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 18px !important;
  margin: 0 auto !important;
}

.stats-grid div {
  display: grid !important;
  min-height: 94px !important;
  padding: 18px 22px !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  column-gap: 18px !important;
  align-items: center !important;
  justify-content: start !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.11) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18), 0 26px 54px rgba(0, 49, 139, 0.16) !important;
  text-align: left !important;
  backdrop-filter: blur(10px) !important;
}

.stats-grid div::after {
  display: none !important;
  content: none !important;
}

.stats-band .stat-icon {
  display: inline-flex !important;
  width: 52px !important;
  height: 52px !important;
  margin: 0 !important;
  grid-row: 1 / 3 !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 52px !important;
  border: 0 !important;
  border-radius: 10px !important;
  color: #087cff !important;
  background: #fff !important;
}

.stats-band .stat-icon svg {
  width: 27px !important;
  height: 27px !important;
  fill: none !important;
  stroke: #087cff !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.stats-band .stat-icon svg path {
  fill: none !important;
  stroke: #087cff !important;
}

.stats-band .stats-grid div:nth-child(3) .stat-icon svg path {
  fill: #087cff !important;
  stroke: #087cff !important;
}

.stats-grid strong {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  color: #fff !important;
  font-family: inherit !important;
  font-size: clamp(30px, 2.15vw, 42px) !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.stats-grid span:not(.stat-icon) {
  display: block !important;
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: start !important;
  margin-top: 6px !important;
  color: #fff !important;
  font-size: clamp(14px, 0.96vw, 17px) !important;
  font-weight: 500 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
}

@media (max-width: 980px) {
  .stats-band.stats-band {
    padding: 48px 0 52px !important;
  }

  .stats-band .shell {
    width: min(calc(100% - 34px), 520px) !important;
    padding: 0 !important;
  }

  .stats-band .shell::before {
    left: 10px !important;
    right: auto !important;
    top: 74px !important;
    width: 116px !important;
    height: 170px !important;
  }

  .stats-band .shell::after {
    top: 24px !important;
    right: 18px !important;
    bottom: auto !important;
    width: 170px !important;
    height: 135px !important;
  }

  .stats-band h2 {
    font-size: 30px !important;
  }

  .stats-subcopy {
    margin: 18px auto 24px !important;
    font-size: 16px !important;
  }

  .stats-divider {
    width: min(250px, 74vw) !important;
    margin-bottom: 24px !important;
  }

  .stats-grid {
    width: 100% !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .stats-grid div {
    min-height: 92px !important;
    padding: 18px 20px !important;
    grid-template-columns: 52px minmax(0, 1fr) !important;
    column-gap: 17px !important;
  }

  .stats-grid strong {
    font-size: 36px !important;
  }

  .stats-grid span:not(.stat-icon) {
    font-size: 15px !important;
  }
}
