/* ═══════════════ CLIENTS — logo wall ═══════════════ */
.cw{--hair:#E6E7EA;--dim:#8A8E95}

/* ── Statement hero ── */
.cw-in{max-width:1240px;margin:0 auto;padding:0 28px;position:relative;z-index:1}

.cw-figwrap{background:var(--grey-950,#1B1C1F)}
.cw-figs{display:flex;flex-wrap:wrap}
.cw-fig{flex:1 1 0;min-width:150px;padding:20px 26px 22px;border-right:1px solid rgba(255,255,255,.12)}
.cw-fig:last-child{border-right:none}
.cw-fig b{
  display:block;font-family:var(--font-display,'Poppins'),sans-serif;
  font-size:36px;font-weight:900;line-height:1;letter-spacing:-.03em;color:#fff
}
.cw-fig b i{font-style:normal;color:var(--red,#FF2836)}
.cw-fig span{
  display:block;font-family:var(--font-mono,monospace);font-size:10.5px;
  letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.42);margin-top:9px
}

/* ── Toolbar ── */
.cw-bar{
  max-width:1240px;margin:0 auto;padding:30px 28px 0;
  display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap
}
.cw-tabs{display:flex;gap:26px;flex-wrap:wrap}
.cw-tab{
  background:none;border:0;padding:0 0 11px;cursor:pointer;
  font-family:var(--font-body,'Poppins'),sans-serif;
  font-size:14px;font-weight:600;color:var(--dim);
  border-bottom:2px solid transparent;transition:.16s;
  display:flex;align-items:baseline;gap:7px;white-space:nowrap
}
.cw-tab .n{font-family:var(--font-mono,monospace);font-size:11px;opacity:.75}
.cw-tab:hover{color:var(--grey-800,#2B2D31)}
.cw-tab.on{color:var(--ink,#1B1C1F);border-bottom-color:var(--red,#FF2836)}

.cw-find{position:relative;display:flex;align-items:center;min-width:210px;padding-bottom:11px}
.cw-find svg{position:absolute;left:0;width:15px;height:15px;stroke:var(--dim);fill:none;stroke-width:2;stroke-linecap:round;pointer-events:none}
.cw-find input{
  width:100%;padding:4px 0 4px 24px;border:0;
  font-family:var(--font-body,'Poppins'),sans-serif;font-size:14px;
  color:var(--ink,#1B1C1F);background:none;outline:none
}
.cw-find input::placeholder{color:var(--dim)}

/* ── Sections ── */
.cw-body{max-width:1240px;margin:0 auto;padding:0 28px 20px;border-top:1px solid var(--hair)}
.cw-sec{padding-top:40px;margin-bottom:14px;scroll-margin-top:90px}
.cw-sec-hd{
  display:flex;align-items:baseline;gap:13px;
  margin-bottom:26px;padding-bottom:16px;position:relative
}
.cw-sec-hd::before{
  content:"";position:absolute;left:2px;bottom:2px;
  width:9px;height:9px;background:var(--red,#FF2836);transform:rotate(-45deg)
}
.cw-sec-hd::after{
  content:"";position:absolute;left:14px;bottom:5.5px;
  width:85px;height:2px;background:var(--red,#FF2836)
}
.cw-sec-hd .num{
  font-family:var(--font-mono,monospace);font-size:11.5px;font-weight:600;
  color:var(--red,#FF2836);letter-spacing:.06em;flex-shrink:0
}
.cw-sec-hd h2{
  font-family:var(--font-display,'Poppins'),sans-serif;
  font-size:19px;font-weight:700;letter-spacing:-.01em;
  color:var(--ink,#1B1C1F);margin:0;line-height:1.25
}
.cw-sec-hd .rule{flex:1;height:1px;background:var(--hair)}
.cw-sec-hd .of{font-family:var(--font-mono,monospace);font-size:11.5px;color:var(--dim);flex-shrink:0}

/* ── The logo wall ── */
.cw-wall{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(184px,1fr));
  gap:1px;background:var(--hair);border:1px solid var(--hair)
}
.cw-tile{
  background:#fff;padding:24px 18px 18px;
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  gap:14px;min-height:146px;position:relative;
  transition:background .18s,box-shadow .2s,z-index 0s
}
.cw-tile:hover{background:#fff;box-shadow:0 8px 26px rgba(15,23,42,.13);z-index:2}

/* logo area — fixed height so every tile lines up */
.cw-mark{
  height:46px;width:100%;display:flex;align-items:center;justify-content:center;
  overflow:hidden
}
.cw-mark img{
  max-height:46px;max-width:100%;object-fit:contain;
  filter:grayscale(1);opacity:.62;transition:filter .22s,opacity .22s
}
.cw-tile:hover .cw-mark img{filter:grayscale(0);opacity:1}

/* text fallback when no logo file exists — naam saaf padhne layak ho */
.cw-word{
  font-family:var(--font-display,'Poppins'),sans-serif;
  font-size:15.5px;font-weight:700;letter-spacing:-.005em;line-height:1.3;
  color:var(--ink,#1B1C1F);text-align:center;transition:color .22s;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden
}
.cw-tile:hover .cw-word{color:var(--red,#FF2836)}

/* bina logo wale tile mein naam hi hero hai — niche caption dohrana band */
.cw-tile.no-logo .cw-mark{height:auto;min-height:46px;align-items:center}
.cw-tile.no-logo .cw-cap{display:none}
.cw-tile.no-logo{justify-content:center}
/* naam ke neeche patli red line, taki tile khaali na lage */
.cw-tile.no-logo .cw-mark::after{
  content:"";position:absolute;left:50%;bottom:16px;transform:translateX(-50%);
  width:22px;height:2px;border-radius:2px;background:var(--red,#FF2836);opacity:.32;transition:width .22s,opacity .22s
}
.cw-tile.no-logo:hover .cw-mark::after{width:38px;opacity:1}

.cw-cap{
  font-size:12.5px;font-weight:600;line-height:1.4;text-align:center;
  color:#3E4248;margin-top:auto;transition:color .18s
}
.cw-tile:hover .cw-cap{color:var(--red,#FF2836)}

/* ── Empty ── */
.cw-empty{display:none;padding:56px 0;text-align:center;color:var(--dim)}
.cw-empty.show{display:block}
.cw-empty b{display:block;font-family:var(--font-display,'Poppins'),sans-serif;font-size:18px;color:var(--ink,#1B1C1F);margin-bottom:6px}
.cw-empty p{font-size:14px;margin:0}

/* ── Closing band ── */
.cw-cta{border-top:1px solid var(--hair);background:#FAFAFA;margin-top:26px}
.cw-cta-in{
  max-width:1240px;margin:0 auto;padding:50px 28px 56px;
  display:flex;align-items:flex-end;justify-content:space-between;gap:34px;flex-wrap:wrap
}
.cw-cta h3{
  font-family:var(--font-display,'Poppins'),sans-serif;
  font-size:28px;font-weight:900;letter-spacing:-.02em;line-height:1.15;
  color:var(--ink,#1B1C1F);margin:0 0 10px;max-width:18ch
}
.cw-cta h3 em{font-style:normal;color:var(--red,#FF2836)}
.cw-cta p{font-size:15px;color:var(--grey-600,#5B5F66);margin:0;max-width:46ch;line-height:1.65}
.cw-acts{display:flex;gap:12px;flex-wrap:wrap;flex-shrink:0}
.cw-btn{
  display:inline-flex;align-items:center;gap:9px;padding:14px 26px;
  font-family:var(--font-display,'Poppins'),sans-serif;
  font-size:14.5px;font-weight:800;border-radius:2px;white-space:nowrap;transition:.18s
}
.cw-btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.cw-btn-solid{background:var(--ink,#1B1C1F);color:#fff}
.cw-btn-solid:hover{background:var(--red,#FF2836);color:#fff}
.cw-btn-line{border:1.5px solid var(--ink,#1B1C1F);color:var(--ink,#1B1C1F)}
.cw-btn-line:hover{background:var(--ink,#1B1C1F);color:#fff}

/* ── Responsive ── */
@media(max-width:900px){
  @media(max-width:768px){
  .cw-wall{grid-template-columns:repeat(auto-fill,minmax(140px,1fr))}
  .cw-tile{padding:18px 12px 14px;min-height:124px;gap:11px}
  .cw-mark{height:36px}
  .cw-mark img{max-height:36px}
  .cw-word{font-size:14px}
  .cw-tile.no-logo .cw-mark::after{bottom:12px}
  .cw-cap{font-size:11px}
  .cw-sec-hd h2{font-size:17px}
  .cw-cta-in{flex-direction:column;align-items:stretch;padding:38px 18px 44px}
  .cw-cta h3{font-size:23px}
  .cw-btn{flex:1;justify-content:center}
}
@media(max-width:420px){
  .cw-wall{grid-template-columns:1fr 1fr}
  .cw-word{font-size:13px}
}


/* ═══════════ CTA buttons — mobile ═══════════
   nowrap + lamba text milkar button ko screen se chauda kar dete the. */
@media (max-width:640px){
  .cw-btn{white-space:normal;text-align:center;flex:1 1 100%;width:100%;
    padding:13px 18px;font-size:13.5px;line-height:1.35;word-break:break-word}
}
