/* =========================================================
   CLINICARE — Estatísticas animadas (73 / 300K+ / 43)
   Carregar DEPOIS de home.css. Funciona com assets/js/stats.js.
   Sem JavaScript a secção continua visível, igual à anterior.
   ========================================================= */

.partners-showcase .partners-stats { grid-template-columns: repeat(3, 1fr) !important; }   /* 3 colunas também em telemóvel */

.partners-showcase .stat-item { z-index: 0; overflow: hidden; }
.partners-showcase .stat-icon,
.partners-showcase .stat-text { position: relative; z-index: 1; }

/* ---- Ícone com anel de progresso ---- */
.partners-showcase .stat-icon {
  width: 60px; height: 60px; margin-bottom: .9rem; border-radius: 50%;
  background: #eef5fb; color: #2775b7;
}
.partners-showcase .stat-icon > svg:not(.stat-ring) { position: relative; width: 25px; height: 25px; }
.partners-showcase .stat-icon .stat-ring {
  position: absolute; inset: 0; width: 100% !important; height: 100% !important; transform: rotate(-90deg); overflow: visible;
}
.stat-ring circle { fill: none; stroke-width: 3; }
.stat-ring .track { stroke: #dbe8f4; }
.stat-ring .bar { stroke: #2775b7; stroke-linecap: round; }

/* ---- Número e legenda ---- */
.partners-showcase .stat-number {
  display: inline-block; font-size: clamp(1.6rem, 6.4vw, 3.4rem);
  font-variant-numeric: tabular-nums; text-align: center;
  background: linear-gradient(180deg, #124d80 20%, #2775b7 130%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.partners-showcase .stat-label { color: #5f6f82; text-wrap: balance; }

/* ---- Barras a subir ao fundo de cada cartão (decorativas) ---- */
.stat-bars {
  position: absolute; left: 0; right: 0; bottom: 0; height: 50%; z-index: 0; pointer-events: none;
  display: flex; align-items: flex-end; gap: 5%; padding: 0 11%;
}
.stat-bars i {
  flex: 1; height: var(--h); border-radius: 6px 6px 0 0;
  background: linear-gradient(180deg, rgba(39,117,183,.17), rgba(39,117,183,.03));
  transform: scaleY(0); transform-origin: bottom;
  transition: transform 1s cubic-bezier(.2,.7,.2,1);
  transition-delay: calc(var(--d, 0ms) + var(--i) * 75ms);
}
.partners-showcase.is-in .stat-bars i { transform: scaleY(1); }

/* ---- Entrada (só quando o JavaScript está ativo) ---- */
.partners-showcase.stats-js .stat-item { opacity: 0; transform: translateY(18px); transition: opacity .7s ease, transform .8s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0ms); }
.partners-showcase.stats-js.is-in .stat-item { opacity: 1; transform: none; }

/* ---- Ao terminar a contagem, o ícone dá um pequeno pulso ---- */
.stat-item.is-done .stat-icon { animation: statPulse 1.1s ease-out 1; }
@keyframes statPulse { 0% { box-shadow: 0 0 0 0 rgba(39,117,183,.35); } 100% { box-shadow: 0 0 0 18px rgba(39,117,183,0); } }

/* ---- Ecrãs pequenos: 3 colunas compactas ---- */
@media (max-width: 768px) {
  .partners-showcase .stat-item { min-height: 0; justify-content: flex-start; padding: 1.4rem .5rem 1.5rem; }
  .partners-showcase .stat-icon { width: 46px; height: 46px; margin-bottom: .7rem; }
  .partners-showcase .stat-icon > svg:not(.stat-ring) { width: 20px; height: 20px; }
  .stat-ring circle { stroke-width: 3.4; }
  .partners-showcase .stat-label { font-size: .76rem; line-height: 1.3; margin-top: .4rem; }
  .stat-bars { height: 40%; padding: 0 8%; gap: 4%; }
}
@media (max-width: 360px) {
  .partners-showcase .stat-label { font-size: .7rem; }
}

@media (prefers-reduced-motion: reduce) {
  .stat-bars i, .partners-showcase.stats-js .stat-item { transition: none; }
  .stat-item.is-done .stat-icon { animation: none; }
}