/* One loose idea takes shape. The four captions follow it down the page. */
.working{
 max-width:1440px;
 margin:100px auto 0;
 padding:62px 6vw 76px;
 color:var(--ink);
}
.working h2{
 font-family:var(--sans);
 font-size:clamp(28px,2.4vw,34px);
 font-weight:500;
 line-height:1.2;
 letter-spacing:-.035em;
 text-align:left;
 max-width:700px;
 margin:0 auto 58px;
}
.working-composition{position:relative;max-width:1080px;margin:0 auto;isolation:isolate}
.working .steps{
 display:grid;
 grid-template-columns:1fr;
 grid-template-rows:repeat(4,minmax(185px,auto));
 gap:0;
 margin:0;
 padding:0;
 border:0;
 list-style:none;
 position:relative;
 z-index:1;
}
.working .steps li{
 width:29%;
 max-width:310px;
 margin:0;
 padding:10px 0 26px;
 text-align:left;
 font-size:19px;
 line-height:1.45;
}
.working .steps li::before{content:none}
.working .steps li:nth-child(1){margin-left:3%}
.working .steps li:nth-child(even){justify-self:end;margin-right:1%}
.working .steps li:nth-child(3){margin-left:0}
.working .steps li:nth-child(4){margin-right:3%;padding-top:20px}
.working .steps h3{
 font-family:var(--serif);
 font-size:clamp(28px,2.65vw,36px);
 font-weight:400;
 line-height:1.1;
 letter-spacing:-.025em;
 margin:0 0 14px;
 text-wrap:balance;
}
.working .steps p{
 margin:0;
 font-family:var(--serif);
 font-size:19px;
 line-height:1.45;
 text-wrap:pretty;
}
.working-illustration{
 position:absolute;
 top:-24px;
 left:50%;
 transform:translateX(-50%);
 width:48%;
 max-width:525px;
 height:auto;
 pointer-events:none;
 z-index:0;
}
.working-links{
 display:flex;
 justify-content:center;
 flex-wrap:wrap;
 gap:20px 42px;
 margin:46px 0 0;
 font-family:var(--sans);
 font-size:14px;
 font-weight:500;
 line-height:1.4;
}
.working-links a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;padding:8px 0}
.working-links a:hover{color:var(--red)}
.working-links span{display:inline-block;margin-left:5px}
@media(max-width:1000px){
 .working{padding-inline:5vw}
 .working h2{margin-bottom:44px}
 .working .steps{grid-template-rows:repeat(4,minmax(190px,auto))}
 .working .steps li{width:31%;margin-left:0!important;margin-right:0!important}
 .working .steps h3{font-size:29px}
 .working .steps p{font-size:18px}
 .working-illustration{width:43%;top:30px;max-width:440px}
}
@media(max-width:700px){
 .working{margin-top:50px;padding:42px 25px 48px}
 .working h2{max-width:360px;margin:0 auto 35px;font-size:28px;text-align:center}
 .working-composition{display:flex;flex-direction:column;max-width:410px}
 .working-illustration{position:static;transform:none;order:0;width:60%;max-width:210px;margin:0 auto 30px}
 .working .steps{order:1;grid-template-rows:none;gap:32px}
 .working .steps li{width:100%;max-width:none;justify-self:stretch!important;padding:0!important}
 .working .steps h3{font-size:30px;margin-bottom:10px}
 .working .steps p{font-size:18px;line-height:1.48}
 .working-links{margin-top:36px;gap:15px 25px;font-size:13px}
}

/* Offers live on their own page; this introduction keeps the existing art-led process. */
.working h2{margin-bottom:22px;}
.working-intro{max-width:700px;margin:0 auto 58px;font:400 21px/1.5 var(--serif);text-wrap:pretty;}
.working-intro a,.working-side a{color:var(--ink);text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;}
.working-side{max-width:650px;margin:32px auto 0;text-align:center;font:400 19px/1.5 var(--serif);}
.choices [hidden]{display:none;}
@media(max-width:700px){.working-intro{font-size:19px;margin-bottom:32px;}.working-side{font-size:18px;text-align:left;margin:20px 0 0;}.working-intro a,.working-side a{display:inline-block;min-height:44px;align-content:center;}}