/* ── Case study page ──────────────────────────────────────────────── */
.cs-banner { width: min(960px, calc(100% - 48px)); margin-inline: auto; padding: 0 0 20px; }
.cs-hero { display: block; width: 100%; border-radius: var(--radius); border: 1px solid var(--line); }
.cs-section { border-top: 1px solid var(--line); }
.cs-section h2 { margin-bottom: 16px; }
.cs-layout { display: grid; grid-template-columns: 1.5fr 1fr; gap: 40px; align-items: start; }
.cs-stats { display: flex; flex-direction: column; gap: 12px; }
.cs-stat {
  background: var(--panel); border: 1px solid var(--line); border-radius: 12px;
  padding: 16px 18px; display: flex; justify-content: space-between; align-items: center;
}
.cs-stat strong { font-size: 0.85rem; color: var(--muted); font-weight: 500; }
.cs-stat span { font-size: 1.05rem; color: var(--accent); font-weight: 700; }
.cs-flow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 8px; }
.cs-step {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 28px;
}
.cs-step-num { color: var(--accent); font-weight: 800; font-size: 1.4rem; display: block; margin-bottom: 12px; }
.cs-step h3 { margin-bottom: 8px; }
.cs-decisions { display: flex; flex-direction: column; gap: 24px; margin-top: 8px; }
.cs-decision h3 { color: var(--accent); font-size: 1rem; margin-bottom: 4px; }
.cs-results { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 8px; }
.cs-result {
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--radius);
  padding: 28px; text-align: center;
}
.cs-result-icon { font-size: 2rem; display: block; margin-bottom: 12px; }
.cs-next ul { padding-left: 20px; }
.cs-next li { color: var(--muted); line-height: 1.7; margin-bottom: 8px; }
.cs-cta { display: flex; gap: 12px; margin-top: 24px; flex-wrap: wrap; }

@media (max-width: 800px) {
  .cs-layout, .cs-flow, .cs-results { grid-template-columns: 1fr; }
}