/* ==========================================================================
   Case study listings — /casestudies/ and /casestudies/tag/{tag}/.
   Layout, cards, chips, pager and CTA come from blog-redesign.css (.vwbr-*);
   this file only adds what case studies have and articles don't: tag pills
   and the client's headline numbers on the featured card. Same tokens.
   ========================================================================== */

/* ---------- tag pills (cards + featured) ---------- */
.vwcs-tags { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.vwcs-tags li { list-style: none; }
/* above the card's stretched title link, so the pills stay clickable */
.vwcs-tags a { position: relative; z-index: 2; display: inline-block; padding: 4px 11px; border: 1px solid var(--line); border-radius: 999px;
  background: var(--canvas); font-family: var(--f-med); font-size: 12.5px; line-height: 1.3; color: var(--ink-2); }
.vwcs-tags a:hover { border-color: var(--ink-2); color: var(--ink); }

.vwcs-tags--dark a { background: transparent; border-color: rgba(255, 255, 255, .24); color: rgba(255, 255, 255, .84); }
.vwcs-tags--dark a:hover { border-color: #fff; color: #fff; }

/* ---------- featured: client numbers in place of the blog's listen art ---------- */
.vwcs-feat--plain { grid-template-columns: minmax(0, 1fr); }
.vwcs-feat__stats { position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: 26px; align-content: center; }
.vwcs-feat__stats li { list-style: none; display: grid; gap: 6px; }
.vwcs-feat__value { font-family: var(--f-semi); font-size: clamp(2.4rem, 4vw, 3.4rem); line-height: 1; letter-spacing: -.03em; color: #fff; }
.vwcs-feat__value em { font-style: normal; color: var(--orange); }
.vwcs-feat__desc { max-width: 18em; font-size: 14.5px; line-height: 1.4; color: rgba(255, 255, 255, .66); }

@media (max-width: 700px) {
  .vwcs-feat__stats { grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 18px; padding-top: 22px;
    border-top: 1px solid rgba(255, 255, 255, .14); }
}