/* Case studies hub + service page previews */

.cs-hub{padding-top:clamp(32px,4vw,48px)}

.cs-filters{
  display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(28px,4vw,40px);
}
.cs-filter{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 16px;border-radius:100px;
  border:1.5px solid var(--border2);background:var(--white);
  font-family:var(--fb);font-size:13px;font-weight:600;color:var(--ink2);
  cursor:pointer;transition:border-color .25s,background .25s,color .25s;
}
.cs-filter span{
  font-size:11px;font-weight:700;min-width:20px;height:20px;padding:0 6px;
  border-radius:100px;background:var(--paper2);color:var(--ink3);
  display:inline-flex;align-items:center;justify-content:center;
}
.cs-filter:hover{border-color:rgba(13,13,13,.18);color:var(--ink)}
.cs-filter.is-active{
  background:var(--ink);border-color:var(--ink);color:var(--white);
}
.cs-filter.is-active span{background:rgba(255,255,255,.12);color:var(--white)}

.cs-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:clamp(16px,2.5vw,24px);
}
.cs-catalog-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px;
  flex-wrap:wrap;margin-bottom:clamp(24px,3vw,32px);
}
.cs-count{
  font-size:13px;font-weight:600;color:var(--ink2);white-space:nowrap;
}
.cs-catalog-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:clamp(16px,2.5vw,24px);
}
.cs-pager{
  display:flex;align-items:center;justify-content:center;gap:16px;
  flex-wrap:wrap;margin-top:clamp(28px,4vw,40px);
}
.cs-pager[hidden]{display:none}
.cs-pager-meta{
  font-size:13px;font-weight:600;color:var(--ink2);
}
.cs-card{
  display:flex;flex-direction:column;
  background:var(--white);border:1px solid var(--border2);
  border-radius:var(--rl);overflow:hidden;
  transition:transform .35s var(--ease),box-shadow .35s,border-color .35s;
}
.cs-card:hover{
  transform:translateY(-4px);
  border-color:rgba(13,13,13,.12);
  box-shadow:0 16px 48px rgba(13,13,13,.08);
}
.cs-card--featured{grid-column:span 2}
.cs-card-media{position:relative;aspect-ratio:16/10;background:var(--paper2);overflow:hidden}
.cs-card-media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.cs-card:hover .cs-card-media img{transform:scale(1.03)}
.cs-card-stat{
  position:absolute;left:14px;bottom:14px;
  padding:8px 12px;border-radius:10px;
  background:rgba(13,13,13,.82);backdrop-filter:blur(8px);
  font-size:12px;font-weight:500;color:rgba(255,255,255,.88);line-height:1.35;
}
.cs-card-stat strong{color:var(--accent);font-weight:800;margin-right:4px}
.cs-card-body{padding:clamp(20px,2.5vw,26px);display:flex;flex-direction:column;flex:1}
.cs-card-industry{
  font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accent2);margin-bottom:10px;
}
.cs-card-title{
  font-family:var(--fd);font-size:clamp(20px,2.5vw,26px);font-weight:800;
  letter-spacing:-.025em;line-height:1.15;margin-bottom:10px;color:var(--ink);
}
.cs-card-q{font-size:14px;color:var(--ink2);line-height:1.65;margin-bottom:18px;flex:1}
.cs-card-cta{
  font-size:13px;font-weight:700;color:var(--ink);
  display:inline-flex;align-items:center;gap:6px;margin-top:auto;
}
.cs-card:hover .cs-card-cta{color:var(--accent2)}
.cs-empty{
  grid-column:1/-1;text-align:center;padding:48px 20px;
  color:var(--ink2);font-size:15px;
}

/* Service page preview row — matches dev-overview svc-visual cards */
#case-studies .svc-scroll{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;
  overflow:visible;padding-bottom:0;
}
.cs-preview-stat{
  display:inline-block;margin-bottom:8px;
  font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--accent);background:rgba(204,255,51,.14);
  padding:4px 10px;border-radius:100px;
}
.svc-visual .cs-svc-metric{
  display:inline-block;
  margin-bottom:10px;
  font-size:11px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--ink);
  background:var(--accent);
  padding:5px 12px;
  border-radius:100px;
  line-height:1.3;
}
.sec-paper .cs-preview-card .svc-desc{
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}

@media(max-width:1024px){
  .cs-grid{grid-template-columns:1fr}
  .cs-catalog-grid{grid-template-columns:repeat(2,1fr)}
  .cs-card--featured{grid-column:span 1}
  #case-studies .svc-scroll{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .cs-catalog-grid{grid-template-columns:1fr}
  #case-studies .svc-scroll{grid-template-columns:1fr}
  .cs-filters{gap:8px}
  .cs-filter{padding:8px 12px;font-size:12px}
}
