/* Proof gets a different proportion from the 6/6 service chapters: an 8/4
   editorial spread, with the project and its explanation visible together. */
.offering-page .offering-work{justify-content:center;gap:24px;padding-block:clamp(64px,9svh,112px)}
.offering-page .offering-case{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);align-items:center;gap:clamp(32px,4vw,72px);text-decoration:none}
.offering-page .offering-case>img{width:100%;height:auto;aspect-ratio:1312/738;object-fit:cover}
.offering-page .offering-case-caption{display:flex;flex-direction:column;gap:28px;min-width:0}
.offering-page .offering-case-caption h2{font-size:clamp(36px,3.6vw,64px);font-weight:300;line-height:1.05;letter-spacing:-.035em;margin:0;overflow-wrap:break-word}
.offering-page .offering-case-caption .offering-copy{gap:28px}
.offering-page .offering-case-caption .offering-body{font-size:clamp(20px,1.4vw,24px);line-height:1.4;margin:0;max-width:32ch}
.offering-page .offering-case .offering-case-link{align-self:flex-start;font-size:18px;line-height:1.4}
.offering-page .offering-case:hover h2{text-decoration:none}
.offering-page .offering-case:is(:hover,:focus-visible) .offering-case-link{text-decoration-thickness:2px}
.offering-page .offering-case:focus-visible{outline:2px solid var(--ink);outline-offset:12px}
@media(max-width:1000px){
 .offering-page .offering-work{min-height:0;padding-block:80px}
 .offering-page .offering-case{grid-template-columns:minmax(0,1fr);gap:32px}
 .offering-page .offering-case-caption{gap:20px}
 .offering-page .offering-case-caption .offering-body{max-width:48ch}
}
