/* ── WORK — one case per client ───────────────────────────── */
.nv-links a.on{color:var(--white)}

.w-index{padding:0 var(--pad);border-bottom:.5px solid var(--hair);position:relative;z-index:2}
.w-index ol{list-style:none;margin:0 auto;padding:0;max-width:1280px;
  display:grid;grid-template-columns:repeat(3,1fr)}
.w-index a{display:block;padding:24px 20px;font-family:var(--fx);font-size:12px;
  letter-spacing:.06em;text-transform:uppercase;color:var(--white);line-height:1.5;
  transition:color .16s linear}
/* the rules between cells, drawn only where cells actually meet */
.w-index li a{border-left:.5px solid var(--hair)}
.w-index li:nth-child(3n+1) a{border-left:0;padding-left:0}
.w-index li:nth-child(n+4) a{border-top:.5px solid var(--hair)}
.w-index a span{display:block;font-family:var(--fm);font-size:9px;letter-spacing:.2em;
  color:var(--acc);margin-bottom:10px}
.w-index a em{display:block;font-style:normal;font-family:var(--fm);font-size:9px;
  letter-spacing:.16em;color:var(--dim);margin-top:6px;transition:color .16s linear}
.w-index a:hover{color:var(--acc)}
.w-index a:hover em{color:var(--bone)}

.case{scroll-margin-top:70px}
.case .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);
  gap:clamp(32px,6vw,96px);align-items:center}
.case.flip .frame{order:2}
.case .build{aspect-ratio:3/3.7}
.case .build .name{font-size:clamp(14px,1.9vw,24px)}
.case .idx{font-family:var(--fm);font-size:10px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--acc);margin-bottom:18px}
.case h2{margin-bottom:22px}
.case .lede{margin-bottom:30px;max-width:none}

.did{list-style:none;margin:0 0 30px;padding:0;border-top:.5px solid var(--hair)}
.did li{position:relative;padding:12px 0 12px 26px;border-bottom:.5px solid var(--hair);
  font-size:14.5px;color:var(--bone);line-height:1.55}
.did li::before{content:'';position:absolute;left:0;top:21px;width:12px;height:1px;
  background:var(--acc)}

.facts{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:12px 36px;
  margin:0 0 34px;font-family:var(--fm);font-size:9px;letter-spacing:.18em;
  text-transform:uppercase;line-height:2.2}
.facts dt{color:var(--dim)}
.facts dd{margin:0;color:var(--white);font-size:11px;letter-spacing:.1em}
.facts dd.hot{color:var(--acc)}

@media(max-width:980px){
  .w-index ol{grid-template-columns:1fr 1fr}
  .w-index li:nth-child(3n+1) a{border-left:.5px solid var(--hair);padding-left:20px}
  .w-index li:nth-child(2n+1) a{border-left:0;padding-left:0}
  .w-index li:nth-child(n+3) a{border-top:.5px solid var(--hair)}
  .case .wrap{grid-template-columns:1fr}
  .case.flip .frame{order:0}
  .case .build{aspect-ratio:3/3.4;max-width:560px}
  .facts{grid-template-columns:repeat(2,auto)}
}
@media(max-width:520px){
  .w-index ol{grid-template-columns:1fr}
  .w-index li a{border-left:0;padding-left:0}
  .w-index li+li a{border-top:.5px solid var(--hair)}
}
.lab-meta b.hot{color:var(--acc)}