/* Home clients: every logo on one calm wall. Hover, touch or focus a tile and it lifts a little in its own place. */
.home-clients { position: relative; padding: clamp(72px, 10vw, 128px) 0 clamp(64px, 8vw, 112px); background: var(--paper, #faf8f4); color: var(--text); }
.home-clients__heading { max-width: 60ch; margin-bottom: clamp(32px, 5vw, 56px); }
.home-clients__heading .eyebrow { color: var(--accent); }
.home-clients__heading h2 { color: var(--text); font-family: var(--display); font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.1; margin: 8px 0 14px; }
.home-clients__heading .lead { color: var(--muted); margin: 0; font-size: 1.05rem; line-height: 1.8; }

.home-clients__group + .home-clients__group { margin-top: clamp(40px, 6vw, 72px); }
.home-clients__label { display: flex; align-items: center; gap: 18px; margin: 0 0 18px; color: var(--muted); font-size: .78rem; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.home-clients__label::after { content: ""; flex: 1; height: 1px; background: var(--line, #e7e1d6); }

.home-clients__wall { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); gap: 14px; }
.home-clients__tile {
  position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 5 / 3; padding: 18px; margin: 0;
  border: 1px solid var(--line, #e7e1d6); border-radius: 14px; background: #fff; cursor: default;
  -webkit-tap-highlight-color: transparent;
  transition: transform .35s cubic-bezier(.22, 1, .36, 1), box-shadow .35s ease, border-color .35s ease;
}
.home-clients__tile img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; pointer-events: none; }
/* The lift: a little up and larger, with an ice-white glow, staying exactly where it is. */
.home-clients__tile:hover, .home-clients__tile:focus-visible, .home-clients__tile:active {
  z-index: 2; transform: translateY(-6px) scale(1.08); border-color: rgba(160, 40, 48, .35);
  box-shadow: 0 0 0 4px rgba(255, 255, 255, .9), 0 0 28px rgba(255, 255, 255, .7), 0 26px 48px -22px rgba(60, 45, 30, .5);
}
.home-clients__tile:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }

@media (max-width: 700px) {
  .home-clients__wall { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 10px; }
  .home-clients__tile { padding: 12px; border-radius: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .home-clients__tile { transition: none; }
}