.work-intro h1 { line-height: 1; letter-spacing: -.075em }
.tools-lead { margin: 1.5rem 0 0; color: var(--soft); font-size: 1rem; line-height: 1.6 }
.tools-list { display: grid; gap: 2rem }
.tool-row { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: clamp(1.5rem, 4vw, 4rem); padding-bottom: 2rem; border-bottom: 1px solid var(--line) }
.tool-preview { position: relative; overflow: hidden; aspect-ratio: 16 / 9; background: #111116; border: 1px solid var(--line) }
.tool-preview img { display: block; width: 100%; height: 100%; object-fit: contain }
.tool-comparison img { position: absolute; inset: 0; object-fit: cover }
.tool-comparison img:nth-child(2) { clip-path: inset(0 0 0 50%) }
.tool-comparison::after { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: rgba(255,255,255,.7) }
.comparison-label { position: absolute; bottom: .75rem; padding: .3rem .5rem; background: rgba(0,0,0,.75); color: #fff; font: 400 .65rem "DM Mono", monospace }
.comparison-label.before { left: .75rem }
.comparison-label.after { right: .75rem }
.tool-status { display: inline-block; margin-bottom: .85rem; color: var(--soft); font: 400 .7rem "DM Mono", monospace }
.tool-copy h2 { margin: 0; font-size: clamp(1.5rem, 2.6vw, 2.5rem); line-height: 1.15; letter-spacing: -.045em }
.tool-copy p { margin: .85rem 0 1.5rem; color: var(--soft); font-size: .95rem; line-height: 1.6; max-width: 42ch }
.tool-link { display: inline-flex; gap: .8rem; align-items: center; font-size: .85rem; border-bottom: 1px solid var(--line); padding-bottom: .3rem }
.tool-row:hover .tool-link, .tool-row:focus-visible .tool-link { border-color: var(--white) }
@media (max-width: 700px) {
  .work-intro h1 { font-size: clamp(2.5rem, 11.5vw, 4rem) }
  .tools-list { gap: 2rem }
  .tool-row { grid-template-columns: minmax(0, 1fr); gap: 1.25rem }
  .tool-copy p { margin-bottom: 1rem }
}