/* /work: sample builds, product clips, how we work. fx tokens only. */
.wk-samples{display:grid;gap:clamp(20px,3vw,32px)}
.wk-sample{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(20px,3.5vw,48px);align-items:start;padding:clamp(20px,3vw,32px);border:1px solid var(--fx-line);border-radius:var(--fx-radius);background:var(--fx-surface);box-shadow:var(--fx-shadow-soft)}
.wk-sample:nth-child(even) .wk-shot{order:2}
.wk-shot{margin:0;display:grid;gap:10px}
.wk-shot-frame{position:relative;border:1px solid var(--fx-line);border-radius:var(--fx-radius-sm);overflow:hidden;aspect-ratio:16/10;background:var(--fx-ground-2)}
.wk-shot-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:top left}
.wk-shot figcaption{font-size:14px;line-height:1.5;color:var(--fx-muted)}
.wk-badge{display:inline-flex;align-items:center;gap:8px;width:max-content;padding:5px 12px;border-radius:999px;border:1px solid var(--brass);color:var(--brass-text);font-size:13px;font-weight:600;letter-spacing:.02em}
.wk-badge::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brass)}
.wk-copy{display:grid;gap:14px;min-width:0}
.wk-copy h3{margin:0;font-size:clamp(22px,2.2vw,28px);line-height:1.2;color:var(--fx-ink)}
.wk-vertical{margin:0;font-size:15px;color:var(--fx-muted)}
.wk-copy dl{display:grid;gap:12px;margin:4px 0 0}
.wk-copy dt{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--brass-text)}
.wk-copy dd{margin:2px 0 0;font-size:16px;line-height:1.6;color:var(--fx-ink)}
.wk-actions{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;margin-top:4px}
.wk-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px);margin:0;padding:0;list-style:none}
.wk-how li{padding:22px;border-top:2px solid var(--brass);background:var(--fx-surface);border-radius:0 0 var(--fx-radius-sm) var(--fx-radius-sm)}
.wk-how h3{margin:0 0 8px;font-size:18px;color:var(--fx-ink)}
.wk-how p{margin:0;font-size:16px;line-height:1.6;color:var(--fx-muted)}
.wk-placeholder{display:grid;gap:10px;max-width:760px;padding:clamp(20px,3vw,28px);border:1px dashed var(--fx-line-strong);border-radius:var(--fx-radius)}
.wk-placeholder h2{margin:0;font-size:clamp(22px,2.4vw,28px);color:var(--fx-ink)}
.wk-placeholder p{margin:0;font-size:16px;line-height:1.6;color:var(--fx-muted)}
@media (max-width:860px){
  .wk-sample{grid-template-columns:1fr}
  .wk-sample:nth-child(even) .wk-shot{order:0}
  .wk-how{grid-template-columns:1fr}
}