/* Case Grid — mockup 01-homepage.html lines 109-110, 209-217 */
.case-grid h2 { font-size: clamp(26px, 3vw, 34px); margin-bottom: 36px; }
.case-result {
  font-family: 'GS Display', sans-serif;
  font-weight: 600;
  font-size: 14px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.case-result em {
  display: block;
  font-style: normal;
  font-family: 'GS Body', sans-serif;
  font-weight: 400;
  font-size: 12px;
  color: var(--slate);
}

/* Cross-card row alignment: the cards share the grid's row tracks (subgrid), so
   the .case-result separator, the metric and the "Read the Case" link sit on the
   same baseline in every card even when one title wraps to fewer lines than the
   others. Rows are assigned explicitly by class so a card that omits an optional
   field leaves its track empty instead of shifting the rest up. */
@supports (grid-template-rows: subgrid) {
  .case-grid .grid-3 { grid-template-rows: repeat(5, auto); }
  .case-grid .grid-3 > .card {
    display: grid;
    grid-row: span 5;
    grid-template-rows: subgrid;
    row-gap: 0;
  }
  .case-grid .grid-3 > .card > .tag-ok { grid-row: 1; justify-self: start; }
  .case-grid .grid-3 > .card > h3 { grid-row: 2; }
  .case-grid .grid-3 > .card > p { grid-row: 3; }
  .case-grid .grid-3 > .card > .case-result { grid-row: 4; }
  .case-grid .grid-3 > .card > .more { grid-row: 5; justify-self: start; align-self: start; }
}