/* ==========================================================================
   components/cifras.css — Cifras
   Sin marcador (index). Contador animado: assets/js/contadores.js.
   ========================================================================== */
.cifras {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin: 0;
  background: var(--c-blanco);
  border-radius: var(--radio);
  box-shadow: var(--sombra-elevada);
}
.cifras__item {
  display: flex;
  flex-direction: column-reverse; /* número arriba, etiqueta abajo; en el HTML dt va primero */
  gap: var(--space-1);
  padding: var(--space-5);
  border-left: var(--hairline) solid var(--c-borde);
}
.cifras__item:first-child { border-left: 0; }
.cifras__valor {
  margin: 0;
  font-family: var(--f-display);
  font-weight: 800;
  font-size: var(--text-cifra);
  line-height: 1;
  font-variant-numeric: tabular-nums;
  color: var(--c-laguna);
}
.cifras__etiqueta { font-size: var(--text-sm); color: var(--c-texto-suave); }
@media (max-width: 640px) {
  .cifras { grid-template-columns: repeat(2, 1fr); }
  .cifras__item:nth-child(3) { border-left: 0; }
  .cifras__item:nth-child(n + 3) { border-top: var(--hairline) solid var(--c-borde); }
}
