:root{--ink:#111b30;--muted:#68758a;--paper:#eef2fa;--white:#fff;--mint:#586df2;--line:#cbd4e3;--darkline:#34415b;--font:Arial,Helvetica,sans-serif}
.piecework{background:#eef2fa;color:#111b30}
.piecework .topbar{border-bottom:1px solid #cbd4e3}
.piecework .button.primary{background:#111b30}
.piecework .button.primary:hover{background:#25365c}
.pw-hero{min-height:670px;display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:8%;padding-block:80px 105px}
.pw-copy h1{font-size:clamp(58px,5.7vw,96px);letter-spacing:-.075em;line-height:1.03;margin:0 0 34px}
.pw-copy h1 span{color:#586df2}.pw-copy p{font-size:21px;line-height:1.5;color:#4b5870;max-width:615px;margin:0 0 34px}
.pw-diagram{background:#111b30;color:#fff;border-radius:22px;padding:35px;min-height:455px;box-shadow:0 28px 70px #111b3026;display:flex;flex-direction:column;justify-content:space-between}
.pw-diagram-head,.pw-diagram-foot{display:flex;justify-content:space-between;gap:20px;color:#b7c1d4;font-size:14px}.pw-diagram-head span:last-child{border:1px solid #61708f;border-radius:100px;padding:5px 11px}
.pw-diagram-sum{display:flex;align-items:baseline;justify-content:space-between;gap:15px;border-bottom:1px solid #35415d;padding-bottom:24px}.pw-diagram-sum small{letter-spacing:.14em;color:#a3b0ca}.pw-diagram-sum strong{font-size:38px;letter-spacing:-.05em}
.pw-track{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.pw-part{min-height:145px;border:1px solid #576482;border-radius:12px;padding:17px;display:flex;flex-direction:column;gap:9px}.pw-part b{font-size:28px;color:#b7c1d4}.pw-part span{font-weight:700;font-size:18px}.pw-part small{font-size:12px;color:#a5b1c8}.pw-part.done{background:#e7ecf7;color:#111b30}.pw-part.done b,.pw-part.done small{color:#536481}.pw-part.active{background:#586df2;border-color:#586df2}.pw-part.active b,.pw-part.active small{color:#e3e8ff}
.piecework .motion-band{background:#111b30;color:#c1cbff}.piecework .motion-track b{color:#586df2}.piecework .motion-band button{border-color:#7788ad}
.pw-mechanism{display:grid;grid-template-columns:.9fr 1.1fr;gap:10%;padding-block:140px}.pw-mechanism h2,.pw-end h2{font-size:clamp(42px,4vw,68px);letter-spacing:-.06em;line-height:1.07;margin:0 0 24px}.pw-mechanism-intro p{font-size:19px;line-height:1.5;color:#58657a}.pw-steps{display:grid;grid-template-columns:1fr 1fr;gap:42px}.pw-steps article b{color:#586df2}.pw-steps h3{font-size:24px;letter-spacing:-.04em;margin:15px 0 9px}.pw-steps p{color:#58657a;line-height:1.5;margin:0;font-size:17px}.pw-end{border-top:1px solid #cbd4e3;padding-block:100px;display:flex;justify-content:space-between;align-items:center;gap:40px}.pw-end h2{margin:0}.piecework footer{border-color:#cbd4e3}
@media(max-width:950px){.pw-hero,.pw-mechanism{grid-template-columns:1fr}.pw-hero{gap:50px}.pw-diagram{max-width:650px}.pw-mechanism{gap:50px}}
@media(max-width:600px){.pw-copy h1{font-size:49px}.pw-copy p{font-size:18px}.pw-diagram{padding:20px;min-height:390px}.pw-part{min-height:140px;padding:10px}.pw-part b{font-size:21px}.pw-part span{font-size:14px}.pw-part small{font-size:11px}.pw-steps{grid-template-columns:1fr}.pw-end{flex-direction:column;align-items:flex-start}}
