/* ---------------- Why us / performance ---------------- */
.why__lead { color: var(--muted); font-size: 1.05rem; margin-bottom: 1.8rem; }
.why__list { list-style: none; padding: 0; margin: 0; display: grid; gap: 1.3rem; }
.why__list li { display: flex; gap: 1rem; }
.why__icon { flex: 0 0 auto; width: 46px; height: 46px; display: grid; place-items: center; background: var(--brand-soft); color: var(--brand); border-radius: 12px; font-size: 1.25rem; }
.why__list h4 { font-size: 1.1rem; font-weight: 600; margin-bottom: .25rem; }
.why__list p { color: var(--muted); font-size: .94rem; margin: 0; }

.speed-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.8rem; box-shadow: var(--shadow-sm); }
.speed-card__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.4rem; font-weight: 600; color: var(--ink); }
.speed-card__head i { color: var(--brand); }
.speed-card__unit { font-size: .75rem; color: var(--muted); font-weight: 500; }
.speed-bar { margin-bottom: 1rem; }
.speed-bar__label { font-size: .85rem; color: var(--body); margin-bottom: .35rem; font-weight: 500; }
.speed-bar__track { background: var(--brand-tint); border-radius: 99px; height: 26px; overflow: hidden; }
.speed-bar__fill {
  height: 100%; width: 0; background: #c2d4cb; border-radius: 99px;
  display: flex; align-items: center; justify-content: flex-end;
  padding-right: .7rem; color: var(--ink); font-size: .8rem; font-weight: 700;
  font-family: var(--font-mono);
  transition: width 1.1s cubic-bezier(.22,.61,.36,1);
}
.speed-bar__fill--us { background: linear-gradient(90deg, var(--brand), #3cbf85); color: #fff; }
.speed-card__foot { font-size: .78rem; color: var(--muted); margin: .6rem 0 0; }

/* animate-in helper for speed bars */
.speed-bar__fill { --w: 0; }
.speed-card.is-visible .speed-bar__fill { width: var(--w); }