.work-trace { margin-top: 48px; scroll-margin-top: 100px; text-align: left; }
.work-trace-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.work-trace-example { flex-shrink: 0; border: 1px solid #d9dee5; border-radius: 99px; padding: 7px 12px; color: #334155; font-size: 14px; }
.work-trace-intro { color: #334155; margin: 16px 0 28px; max-width: 720px; }
.work-trace-steps { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; list-style: none; padding: 0; margin: 0; }
.work-trace-step { position: relative; min-width: 0; padding: 20px; border: 1px solid #dce1e8; border-radius: 18px; background: #fff; display: flex; flex-direction: column; }
.work-trace-step:not(:last-child)::after { content: '→'; position: absolute; right: -16px; top: 47%; z-index: 1; color: #536b8f; background: #f3f4f6; border-radius: 99px; font-size: 20px; }
.work-trace-step-label { display: flex; align-items: center; gap: 8px; color: #334155; font-size: 14px; font-weight: 600; }
.work-trace-step-label > span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #eaf0fa; color: #244b85; }
.work-trace h3 { font-size: 17px; line-height: 1.4; font-weight: 700; color: #172434; margin: 14px 0; }
.work-trace-artifact { flex: 1; background: #f6f8fb; border: 1px solid #e5e9ef; border-radius: 10px; padding: 14px; font-size: 15px; line-height: 1.65; color: #334155; }
.work-trace-artifact-label { font-size: 13px; font-weight: 700; text-transform: none; letter-spacing: .01em; color: #475569; margin-bottom: 8px; }
.work-trace-transform { color: #7588a1; padding: 9px 0; font-size: 18px; }
.work-trace-artifact ul { padding-left: 16px; list-style: disc; }
.work-trace-code { background: #162638; color: #e2ebf6; border-color: #162638; }
.work-trace-code .work-trace-artifact-label { color: #a7c1df; }
.work-trace-caption { color: #334155; font-size: 14px; line-height: 1.6; margin-top: 16px; }
.work-trace-leadership { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.4fr; align-items: center; gap: 20px; padding: 24px; border: 1px solid #cbd9ec; border-radius: 16px; background: #eef3fa; margin-top: 20px; }
.work-trace-leadership-title { display: flex; gap: 12px; align-items: center; }
.work-trace-leadership h3 { font-size: 15px; margin: 0; }
.work-trace-strategy { display: grid; gap: 5px; font-size: 14px; }
.work-trace-strategy span { color: #334155; }
.work-trace-strategy strong { color: #263d59; font-weight: 600; }
.work-trace-leadership > p { font-size: 14px; line-height: 1.6; color: #334155; }
.work-trace-footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 20px; }
.work-trace-footer p { max-width: 650px; color: #475569; font-size: 14px; line-height: 1.6; }
.work-trace-footer a { flex-shrink: 0; font-size: 15px; }
@media (max-width: 1050px) { .work-trace-steps { grid-template-columns: repeat(2,minmax(0,1fr)); } .work-trace-step::after { display: none; } .work-trace-leadership { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .work-trace-heading,.work-trace-footer { align-items: flex-start; flex-direction: column; } .work-trace-steps,.work-trace-leadership { grid-template-columns: 1fr; } .work-trace-step { padding: 18px; } .work-trace-step:not(:last-child)::after { display: block; content: '↓'; top: auto; bottom: -22px; right: 50%; } .work-trace-steps { gap: 24px; } .work-trace-footer a { width: 100%; justify-content: center; } }

.work-trace .eyebrow-label { color: #334155; font-size: 15px; font-weight: 600; letter-spacing: .02em; text-transform: none; }
.work-trace-caption { font-size: 15px; line-height: 1.7; }

.work-trace-actions { display: flex; flex-wrap: wrap; gap: 16px; align-items: center; }
.work-trace-feature-link { color: #1d4ed8; font-weight: 600; }
.work-trace-feature-link:hover { text-decoration: underline; }
.work-trace-footer .work-trace-actions a { font-size: 14px; }
@media (max-width: 600px) { .work-trace-actions { width: 100%; } }