/* ---- client detail pages ----
   Scoped to client pages so changes here don't force a cache-bust across
   every page on the site. */

/* The label column repeats the H1 on these pages, so it costs 306px + 56px
   of gap - a third of the shell - to say nothing. Collapse to one column
   and cap the measure instead, so lines stay readable rather than short. */
.block--client { grid-template-columns: minmax(0, 1fr); gap: 0; }
.block--client > div.block-label { display: none; }
.block--client .block-body { max-width: 780px; }
.block--client .block-body h1 { margin-bottom: 6px; }

.lede { font-size: 1.08rem; line-height: 1.7; color: #333; }

.client-logos {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 28px;
    margin: 26px 0 30px;
    padding: 22px 24px;
    background: #f4f4f4;
    border: 1px solid #ececec;
}
.client-logos img {
    width: 92px;
    height: 92px;
    object-fit: contain;
    /* Source marks are mostly JPEGs on white; multiply drops the white tile
       into the panel instead of leaving a pale square. */
    mix-blend-mode: multiply;
}
.client-logos figcaption {
    flex: 1 1 100%;
    font-size: 12px;
    letter-spacing: .04em;
    color: #8d8d8d;
    margin: 0;
}

@media (max-width: 480px) {
    .client-logos { gap: 16px; padding: 16px; }
    .client-logos img { width: 68px; height: 68px; }
}

/* The page body is wrapped in an inner <article>, so site.css's
   ".block-body > * + *" spacing rule doesn't reach these siblings. */
.block--client .block-body article > * + * { margin-top: 22px; }
.block--client .block-body article > h2 { margin-top: 38px; }

/* Blank cell that keeps an odd-numbered .card-grid from showing the grid's
   --line background through the empty slot in its last row. Not needed once
   the grid collapses to a single column. */
.card--filler { pointer-events: none; }
@media (max-width: 620px) { .card--filler { display: none; } }

/* On pages where the H1 doubles as the label column, the single-column
   layout must not hide it - only a plain repeated label is dropped. */
.block--client > h1.block-label {
    display: block;
    font-size: 30px;
    font-weight: 300;
    letter-spacing: normal;
    text-transform: none;
    margin-bottom: 26px;
}

/* Logo band on the grouped client cards. Fixed height so every title in a
   row starts at the same point, including clients with no logo file yet. */
.card__logo {
    display: flex;
    align-items: center;
    height: 58px;
    margin-bottom: 16px;
}
.card__logo img {
    max-width: 112px;
    max-height: 58px;
    width: auto;
    height: auto;
    /* Source marks are mostly JPEGs on white; multiply drops the white box
       into the card instead of leaving a pale tile. */
    mix-blend-mode: multiply;
    filter: grayscale(1);
    opacity: .74;
    transition: filter .25s ease, opacity .25s ease;
}
.card:hover .card__logo img { filter: none; opacity: 1; }