/* Work with Will: page-specific layout using the shared site palette. */
.work-intro{
  display:grid;
  grid-template-columns:minmax(0,1fr) 240px;
  gap:clamp(2rem,6vw,5rem);
  align-items:center;
  padding-block:clamp(3rem,7vw,5.5rem);
}
.work-intro .display{ font-size:clamp(2.75rem,6vw,4.5rem); max-width:12ch }
.work-intro .lead{ margin-top:1.5rem; color:var(--ink); font-size:clamp(1.2rem,2vw,1.55rem) }
.work-intro-copy > p:not(.lead){ margin-top:1.1rem; max-width:58ch; color:var(--muted); font-size:1.05rem }
.work-intro .btn{ margin-top:1.75rem; border-radius:var(--radius-sm) }
.work-portrait img{ width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:var(--radius-sm) 48px var(--radius-sm) var(--radius-sm) }
.work-portrait figcaption{ margin-top:.9rem; font-weight:600; font-size:1.05rem; line-height:1.5 }
.work-portrait figcaption span{ color:var(--muted); font-weight:400; font-size:.9rem }
.work-portrait a{ text-decoration:underline; text-underline-offset:3px }
.work-service{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);
  gap:clamp(1rem,5vw,4rem);
  padding-block:clamp(2.25rem,5vw,3.75rem);
  border-top:1px solid var(--border-strong);
  scroll-margin-top:90px;
}
.work-service h2,.work-agency h2{ font-family:var(--font-display); font-weight:650; letter-spacing:-.025em; line-height:1.12; font-size:clamp(1.8rem,3.5vw,2.6rem) }
.work-service-copy > p{ font-size:1.07rem; color:var(--muted); max-width:59ch }
.work-service-copy .work-audience{ margin-top:1.2rem; font-size:.97rem }
.work-audience strong{ color:var(--ink); font-weight:600 }
.work-service .textlink{ margin-top:1.5rem }
.work-agency{ padding-block:1rem clamp(3rem,6vw,5rem) }
.work-agency-inner{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.3fr); gap:clamp(1rem,5vw,4rem); padding:clamp(1.5rem,4vw,2.5rem); background:color-mix(in oklab,var(--lime) 9%,var(--bg)); border:1px solid var(--border); border-radius:var(--radius-sm) }
.work-agency p{ color:var(--muted); font-size:1.02rem }
.work-agency .textlink{ margin-top:1.2rem }
@media (max-width:760px){
  .work-intro{ grid-template-columns:1fr; gap:2rem }
  .work-portrait{ display:flex; align-items:center; gap:1.2rem }
  .work-portrait img{ width:104px; border-radius:var(--radius-sm) 26px var(--radius-sm) var(--radius-sm) }
  .work-portrait figcaption{ margin:0 }
  .work-service,.work-agency-inner{ grid-template-columns:1fr }
}