/* Basix case study — page layer on top of case-study-family.css.
   Same system as the JPMC case study; Basix blue (#3F88F9) is the accent. */
:root{
  --accent:#1f62d8; --accent-50:#eaf1ff;
  --accent-line:#3f88f9;
}

.hero-img.device{border:0;background:transparent;max-width:760px;margin-inline:auto}
.users{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;list-style:none;margin:0;padding:0}
.users li{border:1px solid var(--line);border-radius:14px;padding:16px;background:var(--paper);font-size:15px;color:var(--ink-2);line-height:1.45}
.users b{display:block;font-family:var(--font-mono);font-weight:500;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);margin-bottom:6px}
.lbl{display:inline-block;font-family:var(--font-mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;padding:4px 10px;border-radius:999px;margin-bottom:10px}
.lbl-b{background:var(--tint);color:var(--muted)}
.lbl-r{background:#fdecea;color:var(--red)}
.testi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:960px){.users{grid-template-columns:1fr 1fr}.testi{grid-template-columns:1fr}}