/* ─────────────────────────────────────────────
   CLIENTS — framed wall of logos
─────────────────────────────────────────────  */
.clients { padding:56px 0 64px }
.clients-inner {
  display:grid;
  grid-template-columns: 280px 1fr;
  gap:32px;
  align-items:stretch;
}

/* Left: stat block */
.clients-label {
  display:flex;
  flex-direction:column;
  gap:14px;
  align-self:center;
}
.clients-label-tag {
  font-family:var(--font-mono);
  font-size:10.5px;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:var(--ink);
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:7px;
  align-self:flex-start;
  padding:4px 10px 4px 6px;
  background:var(--yellow);
  border:1.5px solid var(--ink);
  border-radius:6px;
  box-shadow: 0 2px 0 var(--ink);
}
.clients-label-tag::before {
  content:'';
  width:9px; height:9px; border-radius:50%;
  background:var(--orange);
  border:1.5px solid var(--ink);
}
.clients-label-text {
  font-family:var(--font-display);
  font-size:26px;
  line-height:1;
  color:var(--ink);
  letter-spacing:-0.8px;
  text-transform:uppercase;
}
.clients-label-text em {
  font-style:normal;
  color:var(--orange-d);
  position:relative;
}
.clients-label-text em::after {
  content:'';
  position:absolute;
  left:-2px; right:-2px;
  bottom:0.05em;
  height:0.22em;
  background:var(--yellow);
  z-index:-1;
  border-radius:2px;
}
.clients-label-meta {
  display:flex;
  gap:8px;
  align-items:center;
  font-family:var(--font-mono);
  font-size:10px;
  letter-spacing:0.8px;
  text-transform:uppercase;
  color:var(--gray-1);
  margin-top:4px;
}
.clients-label-meta::before {
  content:'';
  width:18px; height:1.5px;
  background:var(--ink);
}

/* Right: logo wall card */
.clients-wall {
  position:relative;
  background:var(--white);
  border:1.5px solid var(--ink);
  border-radius:14px;
  box-shadow: 0 4px 0 var(--ink);
  padding:8px 4px;
  display:grid;
  grid-template-columns:repeat(6, 1fr);
  align-items:center;
}
.clients-wall::before {
  content:'';
  position:absolute;
  inset:6px;
  border:1px dashed var(--line-soft);
  border-radius:9px;
  pointer-events:none;
}
.clients-wall-studs {
  position:absolute;
  top:-7px;
  left:18px;
  display:flex;
  gap:6px;
  z-index:30;
}
.clients-wall-studs .stud { width:10px; height:10px }

.c-logo {
  height:64px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 14px;
  position:relative;
  filter:grayscale(.85) contrast(.95);
  opacity:.72;
  transition:opacity .2s, filter .2s, transform .2s;
}
.c-logo + .c-logo::before {
  content:'';
  position:absolute;
  left:0; top:18%; bottom:18%;
  width:1px;
  background:var(--line-soft);
}
.c-logo:hover {
  filter:grayscale(0) contrast(1);
  opacity:1;
  transform:translateY(-1px);
}
.c-logo img {
  max-height:100%;
  max-width:100%;
  width:auto;
  height:auto;
  object-fit:contain;
}