/* Final spacing and illustration-frame corrections. */

/* Keep every generated PNG inside a predictable visual slot. */
.feature-card,
body.light-theme .feature-card,
.module-card,
body.light-theme .module-card {
  overflow: hidden;
}

.feature-card,
body.light-theme .feature-card {
  display: flex;
  flex-direction: column;
}

.feature-illustration,
.module-illustration {
  position: relative;
  display: block;
  flex: 0 0 auto;
  overflow: hidden;
  isolation: isolate;
}

.feature-illustration {
  width: 100%;
  height: clamp(156px, 9.2vw, 188px);
  margin: 0 0 20px;
}

.module-illustration {
  width: 100%;
  height: clamp(126px, 7vw, 148px);
  margin: 0 0 18px;
}

.feature-illustration img,
.module-illustration img {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  margin: 0 !important;
  object-fit: contain !important;
  object-position: 50% 50% !important;
  transform: none !important;
}

.feature-title,
.feature-description,
.module-header,
.module-description,
.module-features {
  position: relative;
  z-index: 1;
}

.module-header {
  min-height: 0;
  margin-bottom: 11px;
}

.module-title {
  width: 100%;
  line-height: 1.42;
}

.module-features {
  margin-top: 4px;
}

/* A tighter, better-proportioned transition from hero to proof points. */
.stats-section {
  padding-bottom: clamp(62px, 4vw, 78px);
}

.stats-container {
  width: min(100%, 1800px);
  min-height: 116px;
  margin: -34px auto 0;
  padding: 28px clamp(24px, 2.6vw, 52px);
  align-items: center;
  border-radius: 26px;
  box-shadow: 0 24px 58px rgba(16, 34, 65, 0.2);
}

.stat-box,
body.light-theme .stat-box {
  display: flex;
  min-height: 60px;
  padding: 6px clamp(14px, 1.8vw, 36px);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.stat-number {
  font-size: clamp(36px, 2.2vw, 46px);
}

.stat-label {
  font-size: clamp(10px, 0.62vw, 12px);
}

@media (max-width: 1099px) {
  .feature-illustration {
    height: clamp(160px, 18vw, 190px);
  }

  .module-illustration {
    height: clamp(138px, 16vw, 168px);
  }
}

@media (max-width: 720px) {
  .feature-illustration,
  .module-illustration {
    height: clamp(168px, 46vw, 205px);
    margin-bottom: 18px;
  }

  .stats-container {
    margin-top: -22px;
    padding: 24px 16px;
    border-radius: 22px;
  }

  .stat-box,
  body.light-theme .stat-box {
    min-height: 72px;
    padding: 8px;
  }
}