.clients { background: var(--b2); }
.cl-top {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 6rem; align-items: end; margin-bottom: 4rem;
}
.cl-g {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: var(--br);
}
.cl {
  background: var(--b2); padding: 2.5rem 2rem;
  position: relative; overflow: hidden; transition: background .3s;
}
.cl:hover { background: var(--b3); }
.cl::after {
  content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 1.5px;
  background: linear-gradient(90deg, var(--g), transparent);
  transform: scaleX(0); transform-origin: left; transition: transform .45s var(--r);
}
.cl:hover::after { transform: scaleX(1); }
.cl-ttl { font-size: .88rem; font-weight: 700; color: var(--t); margin-bottom: .35rem; letter-spacing: -.01em; }
.cl-desc { font-size: .66rem; color: rgba(250,250,248,.62); line-height: 1.7; }