/* Each physical action sits beside its real application screen. */
.hero-replace{font-size:12px;color:var(--muted);margin:14px auto 24px;text-wrap:pretty}
.day-flow{display:block}
.day-flow:before{display:none}
.day-flow .day-stage{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);grid-template-rows:auto auto auto auto auto;grid-template-areas:'role screen' 'title screen' 'summary screen' 'scene screen' 'outcome screen';column-gap:56px;align-items:start;border-top:1px solid #cec8dd;padding:42px 0 50px;margin:0}
.day-flow .day-stage:first-child{padding-top:0;border-top:0}
.day-flow .day-stage>.day-stage-heading{grid-area:role;margin:0;background:transparent}
.day-flow .day-stage>h3{grid-area:title;font-size:clamp(25px,2.5vw,31px);margin:20px 0 12px;max-width:400px}
.day-flow .day-stage>p{grid-area:summary;min-height:0;max-width:400px;font-size:14px;line-height:1.6}
.day-flow .day-stage>.work-scene{grid-area:scene;margin:24px 0 0;min-width:0;border-radius:18px;overflow:hidden;box-shadow:0 15px 30px -23px #352b4f70}
.work-scene img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover}
.day-flow .day-stage>.day-device{grid-area:screen;align-self:center;justify-self:center;margin:0;max-width:100%}
.day-flow .day-stage>.day-laptop{width:100%}
.day-flow .day-stage>.day-phone{width:220px;height:480px}
.day-flow .day-stage>.day-output{grid-area:outcome;justify-content:start;align-self:start;margin-top:18px;font-size:12px}
.day-flow .day-owner .day-laptop img{aspect-ratio:1440/1000;object-fit:contain}
.day-flow .day-mechanic{background:#ffffff28}
@media(max-width:1000px){.day-flow .day-stage{column-gap:30px;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}.day-flow .day-stage>.day-phone{width:195px;height:435px}}
@media(max-width:700px){
 .hero-replace{font-size:11px;max-width:280px;margin-top:14px}
 .day-flow{padding-left:0}
 .day-flow .day-stage{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:'role' 'title' 'summary' 'scene' 'screen' 'outcome';padding:30px 0 38px;gap:0}
 .day-flow .day-stage>.day-stage-heading{width:auto}
 .day-flow .day-stage>h3{font-size:26px;margin-top:18px;max-width:none}
 .day-flow .day-stage>p{font-size:13px;max-width:none}
 .day-flow .day-stage>.work-scene{margin-top:20px;border-radius:14px}
 .day-flow .day-stage>.day-device{margin-top:26px}
 .day-flow .day-stage>.day-phone{width:195px;height:435px}
 .day-flow .day-stage>.day-output{font-size:11px;margin-top:24px}
}