.stats-section {
  padding: 100px 0;
  margin-bottom: 100px;
  position: relative;
  overflow: hidden;
  font-weight: 700;
  font-family: "Proxima Nova Bold", sans-serif;
  z-index: 1;
}

.stats-wrapper::after {
  content: "";
  position: absolute;
  top: 70%;
  left: -10%;
  width: 800px;
  height: 650px;
  transform: translate(-20%, -50%);
  background: radial-gradient(50% 50% at 50% 42%, rgba(12, 58, 112, 0.3), rgba(12, 58, 112, 0.12) 45%, transparent 72%);
  pointer-events: none;
  z-index: -1;
}

.stats-section::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 400px;
  height: 400px;
  background: url("../img/rombs-stats.svg") no-repeat center;
  background-size: contain;
  pointer-events: none;
  z-index: 0;
}

.stats-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0;
  position: relative;
}

.stat-card {
  width: 333px;
  padding: 32px 28px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  flex-shrink: 0;
  background: linear-gradient(
    160deg,
    rgba(20, 58, 105, 0.42) 10.99%,
    rgba(6, 22, 42, 0.55) 89.01%
  );
}

.stat-number {
  font-size: 90px;
  font-weight: 800;
  line-height: 1;
  display: flex;
}

.stat-number span {
  background: linear-gradient(
    100deg,
    #a77427 6.84%,
    #ddb55f 22.38%,
    #f7e3a8 37.91%,
    #fbefc8 50%,
    #f0d48f 63.81%,
    #c79436 79.35%,
    #a77427 93.16%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.stat-card--3 .stat-number {
  background: linear-gradient(
    100deg,
    #a77427 6.84%,
    #ddb55f 22.38%,
    #f7e3a8 37.91%,
    #fbefc8 50%,
    #f0d48f 63.81%,
    #c79436 79.35%,
    #a77427 93.16%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.stat-card--3 .stat-number span {
  background: none;
  -webkit-background-clip: unset;
  -webkit-text-fill-color: unset;
  background-clip: unset;
}

.stat-label {
  font-family: "Proxima Nova Regular", sans-serif;
  color: #d8dde6;
  font-size: 24px;
  font-weight: 400;
}

.stat-card--1 {
  margin-top: 0;
  margin-left: 0;
  position: relative;
  z-index: 1;
}

.stat-card--2 {
  margin-top: 90px;
  margin-left: -80px;
  position: relative;
  z-index: 1;
}

.stat-card--3 {
  margin-top: 180px;
  margin-left: -80px;
  position: relative;
  z-index: 1;
}

@media (max-width: 991px) {
  .stats-wrapper {
    --overlap: 9.535%;
    container-type: inline-size;

    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 0;

    width: 100%;
  }

  .stat-card {
    width: auto;
    flex: 0 0 calc((100% + var(--overlap) * 2) / 3);
    padding: clamp(10px, 3.81cqw, 32px) clamp(10px, 3.34cqw, 28px);
  }

  .stat-number {
    font-size: clamp(26px, 10.73cqw, 90px);
  }

  .stat-label {
    font-size: clamp(13px, 2.86cqw, 24px);
  }

  .stat-card--2 {
    margin: 10.73cqw 0 0 calc(var(--overlap) * -1);
  }

  .stat-card--3 {
    margin: 21.45cqw 0 0 calc(var(--overlap) * -1);
  }
}

@media (max-width: 768px) {
  .stats-section {
    padding: 0;
    margin-bottom: 40px;
  }
  .stats-wrapper::after {
    display: none;
  }
  .stats-section::before {
    display: none;
  }
  .stats-section::after {
    display: none;
  }
}