/* ============================================================
   Client logo grid — row-by-row "falling" reveal
   ------------------------------------------------------------
   Purely additive, same pattern as site-reveal.css: the hidden
   starting state is only ever added by client-logo-fall.js at
   runtime, so with JS blocked/failing, or for reduced-motion
   users, every logo renders exactly as the normal .client-logo
   CSS already draws it — nothing here can hide content on its
   own. Logos drop in from above, grouped by the row they
   actually sit in on the live grid (grid-template-columns
   changes at the tablet/mobile breakpoints, so rows are grouped
   in JS off real layout rather than assumed here), and rows
   fall one after another rather than all at once.
   ============================================================ */
.client-logo.logo-fall-init {
  opacity: 0;
  transform: translateY(-42px) scale(.92);
  transition:
    opacity .5s cubic-bezier(.34, 1.56, .64, 1),
    transform .6s cubic-bezier(.34, 1.56, .64, 1);
}

.client-logo.logo-fall-in {
  opacity: 1;
  transform: translateY(0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
  .client-logo.logo-fall-init {
    opacity: 1;
    transform: none;
    transition: none;
  }
}