@charset "UTF-8";
/**
 * @file
 * Stats counter styles — mobile-first.
 * Figma: Home desktop 26:1808, Home mobile 26:5393.
 */
/* ==========================================================================
   Mobile base (xs) — Figma 26:5393
   ========================================================================== */
.vel-stats {
  background: var(--vel-primary);
  overflow: hidden;
}

.vel-stats__inner {
  padding: var(--vel-space-xl) var(--vel-space-md); /* 32px 16px */
}

.vel-stats__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--vel-space-md); /* 16px */
  padding: 0 var(--vel-space-md); /* 16px internal */
}

.vel-stats__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--vel-space-sm); /* 8px */
  text-align: center;
  height: 88px; /* Figma mobile: h-88px */
}

.vel-stats__header {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--vel-space-sm);
}

.vel-stats__icon {
  width: 32px;
  height: 32px;
  flex-shrink: 0;
}

.vel-stats__number {
  font-family: var(--vel-font-heading);
  font-size: var(--vel-text-3xl-plus); /* 36px */
  font-weight: 800;
  color: var(--vel-bg-white);
  line-height: var(--vel-leading-heading-sm-plus); /* 48px */
  letter-spacing: var(--vel-tracking-snug); /* -0.75px */
}

/* Números que son texto (ej: "Nuevos", "Despliegues") — 30px en mobile Figma */
.vel-stats__number--text {
  font-size: var(--vel-text-3xl); /* 30px */
}

.vel-stats__suffix {
  font-size: 0.6em;
}

.vel-stats__label {
  font-family: var(--vel-font-body);
  font-size: var(--vel-text-xs); /* 12px */
  font-weight: 600;
  color: var(--vel-bg-white);
  text-transform: uppercase;
  letter-spacing: var(--vel-tracking-label); /* 0.6px */
  text-align: center;
  line-height: var(--vel-leading-meta); /* 16px */
}

/* ==========================================================================
   lg (992px) — Desktop: 4 inline — Figma 26:1808
   ========================================================================== */
@media (min-width: 992px) {
  .vel-stats__inner {
    padding: var(--vel-space-2xl) var(--vel-content-padding); /* 48px 80px */
  }
  .vel-stats__grid {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding: 0;
    gap: 0;
  }
  .vel-stats__card {
    flex: 0 1 auto;
    height: auto;
    gap: var(--vel-space-xl); /* 32px */
  }
  /* Figma card widths: 282, 304, 335, 442 */
  .vel-stats__card:nth-child(1) {
    width: 282px;
  }
  .vel-stats__card:nth-child(2) {
    width: 304px;
  }
  .vel-stats__card:nth-child(3) {
    width: 335px;
  }
  .vel-stats__card:nth-child(4) {
    width: 442px;
  }
  .vel-stats__header {
    gap: var(--vel-space-md);
  }
  .vel-stats__icon {
    width: 42px;
    height: 42px;
  }
  .vel-stats__number,
  .vel-stats__number--text {
    font-size: 48px;
    line-height: var(--vel-leading-heading-md); /* 48px */
  }
  .vel-stats__label {
    font-size: var(--vel-text-lg); /* 18px */
    letter-spacing: var(--vel-tracking-label);
    line-height: var(--vel-leading-card-body); /* 18px */
    min-height: 85px; /* Figma: h-85px for vertical alignment */
    display: flex;
    align-items: center;
    justify-content: center;
  }
  /* Labels largos: font-size reducido para que quepan en la card */
  .vel-stats__label--long {
    font-size: var(--vel-text-lg); /* 18px */
  }
}
/* xl (1200px) — Featured */
@media (min-width: 1200px) {
  .vel-stats__header {
    gap: var(--vel-space-lg);
  }
  .vel-stats__icon {
    width: 64px;
    height: 64px;
  }
  .vel-stats__number,
  .vel-stats__number--text {
    font-size: 64px;
    line-height: var(--vel-leading-heading-sm); /* 36px */
  }
  .vel-stats__label {
    font-size: var(--vel-text-2xl); /* 24px */
    letter-spacing: var(--vel-tracking-normal); /* 2px */
    line-height: normal;
  }
}
/*# sourceMappingURL=stats-counter.css.map */