:root { --impact-installed: 1; }

.impact {
  position: relative;
  padding: 3rem 0 3.25rem;
  overflow: clip;
  color: #fff;
}

.impact__bg {
  position: absolute; inset: 0;
  background:
    radial-gradient(60% 80% at 20% 15%, rgba(241,169,126,.18), transparent 60%),
    radial-gradient(60% 80% at 80% 30%, rgba(255,217,177,.12), transparent 60%),
    linear-gradient(180deg, #141632, #0f1022 62%);
  filter: saturate(105%);
  z-index: 0;
}

.impact .container { position: relative; z-index: 1; }

.impact__grid {
  list-style: none; margin: 0; padding: 0;
  display: grid; gap: 1rem;
  grid-template-columns: repeat(5, minmax(0,1fr));
}
@media (max-width: 1100px) { .impact__grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 700px)  { .impact__grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }
@media (max-width: 420px)  { .impact__grid { grid-template-columns: 1fr; } }

.impact__card {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 16px;
  padding: 1rem .9rem 1.1rem;
  backdrop-filter: blur(6px);
  box-shadow: 0 10px 26px rgba(0,0,0,.22);
  display: grid; grid-template-rows: auto auto auto;
  align-items: center; gap: .35rem;
  transition: transform .25s ease;
}
.impact__card:focus-within,
.impact__card:hover { transform: translateY(-2px); }

.impact__orb {
  position: relative;
  aspect-ratio: 1 / 1;
  width: 100%; max-width: 140px;
  margin: .25rem auto 0;
}

.impact__ring { position: absolute; inset: 0; }

.ring__track {
  fill: none;
  stroke: rgba(255,255,255,0.12);
  stroke-width: 7;
}

.ring__arc {
  fill: none;
  stroke: url(#ringGrad);
  stroke-linecap: round;
  stroke-width: 7;
  /* Gentle reveal and breathe (no carnival sweep) */
  stroke-dasharray: 314;
  stroke-dashoffset: 314;
  animation:
    ringReveal 1400ms ease-out forwards,
    ringBreathe 5200ms ease-in-out 1400ms infinite alternate;
  opacity: 0.9;
}

@keyframes ringReveal { to { stroke-dashoffset: 0; } }
@keyframes ringBreathe { 0% { opacity: .85; } 100% { opacity: .55; } }

.impact__digits {
  position: absolute; inset: 0;
  display: grid; place-items: center;
  text-shadow: 0 3px 18px rgba(0,0,0,.28);
}
.digits {
  font-weight: 800;
  font-size: clamp(1.7rem, 4.6vw, 2.3rem);
  letter-spacing: 0.3px;
  line-height: 1;
}

.impact__label {
  text-align: center;
  font-size: .95rem;
  color: #e8eaf4;
  margin: .15rem 0 0;
}
.impact__note {
  text-align: center;
  color: #cfd2e5;
  font-size: .82rem;
  margin: 0 0 .15rem 0;
}

/* Removed confetti/comet for a calmer tone */
