/* ── CASE STUDIES LISTING & POST PAGES ── */
/* Extends blog.css — import blog.css before this file */

/* Override blog-tag colour for case study posts */
.blog-tag.tag-cs {
  background: rgba(5,150,105,0.08);
  color: #059669;
  border-color: rgba(5,150,105,0.2);
}

/* == METRICS STRIP (below post-hero) == */
.cs-metrics {
  background: var(--bg-alt2);
  border-top: 1px solid var(--border-lg);
  border-bottom: 1px solid var(--border-lg);
  padding: 32px 0;
}
.cs-metrics-inner {
  display: flex;
  max-width: 840px;
  margin: 0 auto;
}
.cs-metric {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 5px;
  padding: 0 24px;
  border-right: 1px solid var(--border-lg);
}
.cs-metric:last-child { border-right: none; }
.cs-metric-num {
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: -0.04em;
  color: var(--purple);
  line-height: 1;
}
.cs-metric-lbl {
  font-size: 11px;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 600;
  line-height: 1.4;
}

/* == CUSTOMER INFO CARD == */
.cs-customer-card {
  background: var(--purple-xxl);
  border: 1px solid var(--purple-xl);
  border-radius: var(--r-xl);
  padding: 24px 28px;
  margin: 40px 0;
}
.cs-customer-card h4 {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--purple);
  margin-bottom: 16px;
}
.cs-customer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.cs-customer-item { display: flex; flex-direction: column; gap: 3px; }
.cs-customer-label {
  font-size: 10px;
  color: var(--muted);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.cs-customer-value { font-size: 13.5px; color: var(--text); font-weight: 600; line-height: 1.4; }

/* == RESULTS HIGHLIGHT BOX == */
.cs-results {
  background: linear-gradient(135deg, #064E3B 0%, #059669 100%);
  border-radius: var(--r-xl);
  padding: 32px 32px 28px;
  margin: 40px 0;
}
.cs-results h3 {
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: rgba(255,255,255,0.6);
  margin-bottom: 20px;
}
.cs-results-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.cs-result-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cs-result-num {
  font-size: 1.8rem;
  font-weight: 900;
  color: #fff;
  letter-spacing: -0.04em;
  line-height: 1;
}
.cs-result-lbl {
  font-size: 12px;
  color: rgba(255,255,255,0.65);
  line-height: 1.4;
}

/* == RESPONSIVE == */
@media (max-width: 700px) {
  .cs-metrics-inner { flex-wrap: wrap; }
  .cs-metric {
    flex: 0 0 50%;
    border-right: none;
    border-bottom: 1px solid var(--border-lg);
    padding: 16px 0;
  }
  .cs-metric:nth-child(odd) { border-right: 1px solid var(--border-lg); }
  .cs-metric:nth-last-child(-n+2) { border-bottom: none; }
  .cs-customer-grid { grid-template-columns: 1fr 1fr; }
  .cs-results-grid { grid-template-columns: 1fr; }
}