.task-case{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(240px,.85fr);gap:clamp(24px,4vw,56px);align-items:center;margin:42px 0 26px}
.task-case .recording-frame{margin:0}
.task-case .recording-preview{width:100%;text-align:left}
.task-case .recording-preview img{aspect-ratio:16/10;object-fit:contain;background:#0b1728}
.task-case-copy h3{font-size:clamp(25px,3vw,38px);line-height:1.18;margin:12px 0 20px}
.task-case-copy p{color:var(--muted);font-size:16px;line-height:1.65}
.task-case-steps{list-style:none;padding:0;margin:24px 0;display:grid;gap:18px}
.task-case-steps li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;align-items:start}
.task-case-steps .step-index{border:1px solid #376080;color:#78b8ff;border-radius:50%;height:30px;display:grid;place-items:center;font-size:12px}
.task-case-steps strong{display:block;color:#eff5ff;margin-bottom:4px;font-weight:600}
.task-case-steps small{color:#a9b8cb;line-height:1.55;font-size:14px;display:block}
.task-case-facts{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.task-case-facts span{border:1px solid #294461;color:#b5c8df;font-size:12px;border-radius:99px;padding:5px 10px}
.task-secondary{margin:30px 0 0;padding-top:24px;border-top:1px solid #274058;display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}
.task-secondary p{margin:0;max-width:660px;color:#a9b8cb;line-height:1.6}
#task-demo-dialog{width:min(1100px,calc(100vw - 32px));max-height:92svh;padding:20px;background:#0a1525;color:#eef5ff;border:1px solid #385778;border-radius:18px;overflow:auto}
#task-demo-dialog::backdrop{background:rgb(2 8 16 / .87)}
#task-demo-dialog .dialog-top{gap:18px;margin-bottom:16px}
#task-demo-dialog h2{font-size:clamp(20px,2.8vw,32px);margin:8px 0 0;line-height:1.2}
#task-demo-dialog video{display:block;width:100%;height:auto;max-height:calc(92svh - 190px);object-fit:contain;background:#040b14;border-radius:10px}
#task-demo-dialog .task-demo-note{margin:14px 0 0;color:#a9b8cb;font-size:13px;line-height:1.55}
#task-demo-dialog .dialog-close{min-width:44px;min-height:44px;flex:none}
@media(max-width:800px){.task-case{grid-template-columns:1fr;gap:26px}.task-case-copy{max-width:620px}.task-case-copy h3{margin-top:0}.task-case-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.task-case-steps li{grid-template-columns:1fr;gap:10px}}
@media(max-width:480px){.task-case-steps{grid-template-columns:1fr;gap:16px}.task-case-steps li{grid-template-columns:30px minmax(0,1fr)}#task-demo-dialog{padding:14px;width:calc(100vw - 20px)}#task-demo-dialog video{max-height:calc(92svh - 190px)}#task-demo-dialog .eyebrow{font-size:10px}}
