/* Client stories: a shared editorial rhythm for the homepage and case studies. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.client-case{--case-tint:#e7e5da}
.case-santa{--case-tint:#e0e7df}
.case-intro{padding-top:152px;padding-bottom:72px}
.case-back{display:inline-flex;align-items:center;gap:20px;font-size:13px;margin-bottom:57px;padding-block:10px;border-bottom:1px solid var(--line)}
.case-intro h1{font-size:clamp(56px,7vw,106px);line-height:1.04;font-weight:300;letter-spacing:-.065em;margin:25px 0}
.case-client-name{font-size:21px;font-weight:600;letter-spacing:-.02em}
.case-overview{display:grid;grid-template-columns:1.7fr 1fr;gap:10%;margin-top:66px}
.case-lede{font-size:clamp(22px,2.45vw,35px);font-weight:400;line-height:1.45;letter-spacing:-.035em}
.case-facts{margin:0;font-size:13px;line-height:1.8;display:grid;grid-template-columns:1fr;gap:21px}
.case-facts dt{font-size:12px;font-weight:700;margin-bottom:5px}
.case-facts dd{margin:0;color:var(--muted)}
.case-facts .text-link{padding:3px 0;color:var(--ink)}
.client-case figure{margin-block:0}
.client-case figcaption{font-size:11px;color:var(--muted);line-height:1.7;margin-top:16px;max-width:650px}
.case-hero>img{height:min(650px,52vw);object-fit:cover;object-position:center 48%}
.case-santa .case-hero>img{object-position:50% 52%}
.case-chapter{display:grid;grid-template-columns:1fr 2fr;gap:10%;padding-block:105px}
.case-chapter>.eyebrow,.case-chapter>div>.eyebrow{padding-top:7px}
.case-prose{max-width:780px}
.case-prose h2,.case-side-title{font-size:clamp(32px,3.5vw,50px);line-height:1.12;margin-bottom:30px}
.case-prose p,.case-steps p{font-size:16px;line-height:1.9;color:var(--muted);max-width:680px}
.case-prose p+p{margin-top:23px}
.case-need{background:var(--case-tint)}
.case-need .case-chapter{padding-block:85px}
.case-website{padding-top:85px}
.case-screen{background:var(--case-tint);padding:65px 8%}
.case-screen img{width:100%;height:auto;object-fit:contain;box-shadow:0 20px 60px #302d3820}
.case-side-title{margin-top:32px;font-size:clamp(32px,3.3vw,46px)}
.case-steps{list-style:none;padding:0;margin:0}
.case-steps li{display:grid;grid-template-columns:28px 1fr;gap:22px;border-top:1px solid var(--line);padding:27px 0 35px}
.case-steps li:last-child{padding-bottom:0}
.case-step-number{font-size:11px;padding-top:7px;color:var(--muted)}
.case-steps h3{font-size:25px;line-height:1.25;margin-bottom:15px;letter-spacing:-.04em}
.case-detail img{width:100%;height:auto;object-fit:contain}
.case-deliverables{list-style:none;margin:38px 0 20px;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0 30px;font-size:13px}
.case-deliverables li{padding:17px 0;border-top:1px solid var(--line)}
.case-delivery .text-link{display:inline-flex;gap:25px;align-items:center;border-bottom:1px solid currentColor}
@media(max-width:900px){
 .case-overview{gap:8%;grid-template-columns:1.5fr 1fr}.case-chapter{gap:7%;grid-template-columns:1fr 2fr}.case-prose p,.case-steps p{font-size:15px}
}
@media(max-width:640px){
 .case-intro{padding-top:115px;padding-bottom:45px}.case-back{margin-bottom:35px}
 .case-intro h1{font-size:clamp(41px,10.5vw,64px);line-height:1.08;margin:23px 0}.case-intro h1 br{display:none}
 .case-client-name{font-size:19px}.case-overview{grid-template-columns:1fr;gap:35px;margin-top:35px}.case-lede{font-size:23px;line-height:1.5}
 .case-facts{grid-template-columns:1fr 1fr;gap:22px 18px;font-size:12px}.case-facts>div:last-child{align-self:end}.case-facts .text-link{font-size:12px;line-height:1.7}
 .case-hero>img{height:75vw;object-position:center}.client-case figcaption{font-size:10px;margin-top:12px}
 .case-chapter{grid-template-columns:1fr;gap:28px;padding-block:65px}.case-prose h2,.case-side-title{font-size:34px;margin-bottom:23px}
 .case-prose p,.case-steps p{font-size:14px;line-height:1.85}.case-need .case-chapter{padding-block:60px}
 .case-website{padding-top:55px}.case-screen{padding:22px 16px}.case-side-title{margin-top:22px}.case-side-title br{display:none}
 .case-steps li{gap:13px;padding-block:23px 30px}.case-steps h3{font-size:23px}.case-deliverables{grid-template-columns:1fr;font-size:13px;margin-top:28px}
}

/* Website previews retain their full frame, with a wider closing client card. */
.case-boarding{--client-tint:#f1e9bc;--case-tint:#f1e9bc}
.case-halloween{--client-tint:#eddfd2;--case-tint:#eddfd2}
.case-vaneats{--client-tint:#e4e8d9;--case-tint:#e4e8d9}
.case-saygday{--client-tint:#dfe8df;--case-tint:#dfe8df}
.case-hearis{--client-tint:#d9e7e3;--case-tint:#d9e7e3}
.case-digital .case-hero{padding:55px 6%;background:var(--case-tint)}
.case-digital .case-hero>img{height:auto;object-fit:contain}
.case-digital .case-hero figcaption{max-width:820px}
.case-digital figcaption a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:900px){
 .case-digital .case-hero{padding:35px 5%}
}
@media(max-width:640px){
 .case-digital .case-hero{padding:20px 16px}
}

.saygday-image{background:#dfe8df}

