.cases-page { background:#f8f7f4; color:#242424; }
.cases-page * { box-sizing:border-box; }
.cases-hero { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:clamp(360px,31.25vw,490px); padding:40px 24px; background:url('../images/news/header.png') center/cover no-repeat; color:#fff; text-align:center; }
.cases-hero-score { background-image:url('../images/news/header-score.png'); }
.cases-hero p { margin:0 0 28px; font-size:17px; letter-spacing:3px; }
.cases-hero h1 { margin:0; font-size:clamp(38px,3.65vw,70px); line-height:1.3; font-weight:600; }
.cases-wrap { width:84%; max-width:1600px; margin:0 auto; }
.cases-content { padding:40px 0 190px; }
.cases-filters { display:flex; flex-wrap:wrap; justify-content:center; gap:20px; margin:0 0 60px; }
.cases-filters a { min-width:100px; padding:8px 16px; border:1px solid #d5d8db; border-radius:6px; color:#888; font-size:16px; line-height:1.3; text-decoration:none; text-align:center; }
.cases-filters a.is-active,.cases-filters a:hover,.cases-filters a:focus { border-color:#8a9fb2; color:#07365f; }
.case-featured { display:grid; grid-template-columns:1fr 1fr; align-items:start; gap:48px; margin:0 0 120px; }
.case-image { display:block; width:100%; aspect-ratio:898/383; overflow:hidden; background:#063463; text-decoration:none; }
.case-image img { display:block; width:100%; height:100%; object-fit:cover; }
.case-featured-copy { display:flex; flex-direction:column; align-self:stretch; margin:0; min-width:0; }
.case-featured h2 { margin:0 0 18px; padding-bottom:20px; border-bottom:1px solid #dedbd4; font-size:34px; line-height:1.4; font-weight:500; }
.case-featured h2 a,.case-card h2 a { color:#242424; text-decoration:none; }
.case-featured h2 a:hover,.case-card h2 a:hover { color:#07365f; }
.case-lead { flex:1; margin:0 0 26px; color:#888; font-size:17px; line-height:1.8; white-space:pre-line; overflow-wrap:anywhere; }
.case-read { display:inline-block; align-self:flex-start; margin-top:auto; color:#07365f; font-size:17px; font-weight:600; line-height:1.5; text-decoration:none; }
.case-read:hover,.case-read:focus { color:#07365f; text-decoration:none; }
.cases-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); column-gap:96px; row-gap:120px; }
.case-card { display:flex; flex-direction:column; min-width:0; margin:0; }
.case-card h2 { margin:24px 0 30px; font-size:28px; line-height:1.35; font-weight:500; overflow-wrap:anywhere; }
.cases-more { display:block; width:100%; min-height:64px; margin:70px 0 0; padding:18px; border:1px solid #d5d8db; border-radius:8px; background:#fff; color:#07365f; font-size:17px; cursor:pointer; }
.cases-more:disabled { opacity:.6; cursor:wait; }
.cases-more[hidden] { display:none; }
.cases-message { margin:18px 0 0; color:#8a423a; font-size:15px; text-align:center; }
.cases-empty { min-height:240px; padding:80px 20px; text-align:center; color:#888; font-size:18px; }
@media(max-width:1200px) {
 .cases-wrap{width:calc(100% - 48px)}.case-featured{gap:32px;margin-bottom:80px}.case-featured h2{font-size:28px}.case-lead{font-size:15px}.cases-grid{column-gap:40px;row-gap:80px}.case-card h2{font-size:23px}.case-read{font-size:15px}
}
@media(max-width:960px) {
 .cases-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:64px 28px}.case-featured{gap:24px}.case-featured h2{font-size:25px}.case-lead{line-height:1.7}
}
@media(max-width:600px) {
 .cases-hero{min-height:300px}.cases-hero p{font-size:12px;letter-spacing:2px;margin-bottom:20px}.cases-hero h1{font-size:40px}.cases-wrap{width:calc(100% - 32px)}.cases-content{padding:28px 0 64px}.cases-filters{gap:10px;margin-bottom:32px}.cases-filters a{min-width:0;font-size:14px;padding:8px 12px}.case-featured{grid-template-columns:1fr;gap:22px;margin-bottom:48px}.case-featured h2{font-size:25px;margin-bottom:18px}.case-lead{font-size:15px;margin-bottom:22px}.cases-grid{grid-template-columns:1fr;gap:48px}.case-card h2{font-size:23px;margin:18px 0 22px}.cases-more{margin-top:40px;font-size:15px;min-height:56px}
}

/* Results have no filter row, so give the featured article extra space below the hero. */
.cases-content-score { padding-top:80px; }
@media(max-width:600px) { .cases-content-score { padding-top:40px; } }

/* Clamp the title text separately so the featured heading divider stays visible. */
.case-featured h2 a,.case-card h2 a {
  display:-webkit-box;
  -webkit-box-orient:vertical;
  overflow:hidden;
  overflow-wrap:anywhere;
}
.case-featured h2 a { -webkit-line-clamp:2; line-clamp:2; }
.case-card h2 a { -webkit-line-clamp:3; line-clamp:3; }

/* Let the image determine the featured row height; long copy cannot enlarge it. */
.case-featured-copy {
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  row-gap:16px;
  min-height:0;
  overflow:hidden;
  contain:size;
}
.case-featured h2 { margin:0; padding-bottom:16px; }
.case-featured .case-lead {
  align-self:start;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:var(--case-lead-lines,5);
  line-clamp:var(--case-lead-lines,5);
  min-height:0;
  margin:0;
  overflow:hidden;
}
.case-featured .case-read { align-self:end; justify-self:start; margin:0; }
@media(max-width:960px) {
  .case-featured { grid-template-columns:1fr; }
  .case-featured-copy { contain:none; grid-template-rows:auto auto auto; }
  .case-featured .case-lead { -webkit-line-clamp:5; line-clamp:5; }
}