/* JJ&S service-work section only. Matches the Road Sweeper showcase. */
.jjs-service-work, .jjs-service-work * { box-sizing: border-box; }
.jjs-service-work { background:#fff; padding:70px 46px; font-family:inherit; }
.jjs-service-work__inner { max-width:1320px; margin-inline:auto; }
.jjs-service-work__header { max-width:850px; margin:0 auto 30px; text-align:center; }
.jjs-service-work__eyebrow { display:block; margin:0 0 10px; color:#805e00; font-size:12px; font-weight:900; letter-spacing:.16em; line-height:1.5; text-transform:uppercase; }
.jjs-service-work__heading { margin:0 0 14px; color:#111; font-size:clamp(31px,3.6vw,48px); font-weight:900; letter-spacing:-.035em; line-height:1.04; }
.jjs-service-work__intro { margin:0; color:#555; font-size:16px; line-height:1.55; }
.jjs-service-work__grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:26px; }
.jjs-service-work__card { grid-column:span 2; display:flex; flex-direction:column; min-width:0; overflow:hidden; background:#fff; border:1px solid #dfdbd1; border-radius:7px; box-shadow:0 12px 28px rgb(0 0 0 / .055); }
.jjs-service-work--five .jjs-service-work__card:nth-child(4) { grid-column:2 / span 2; }
.jjs-service-work--five .jjs-service-work__card:nth-child(5) { grid-column:4 / span 2; }
.jjs-service-work--four .jjs-service-work__grid { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:1100px; margin-inline:auto; }
.jjs-service-work--four .jjs-service-work__card { grid-column:auto; }
.jjs-service-work__figure { margin:0; }
.jjs-service-work__photo { display:flex; align-items:center; justify-content:center; aspect-ratio:4 / 3; overflow:hidden; background:#f7f6f2; }
/* Keep the entire genuine photo visible. These viewports exclude social UI.
   Percentages belong to the supplied source screenshot; do not change it alone. */
.jjs-service-work__capture { position:relative; display:block; flex:none; width:var(--photo-width,100%); aspect-ratio:var(--photo-ratio); overflow:hidden; }
.jjs-service-work .jjs-service-work__source { position:absolute; display:block; top:0; left:var(--source-left,0%); width:var(--source-width,100%); height:auto; max-width:none; max-height:none; margin:0; border:0; border-radius:0; transform:translateY(var(--source-shift)); }
.jjs-service-work__credit { margin:0; padding:7px 16px; color:#666; background:#f7f6f2; font-size:11px; line-height:1.4; }
.jjs-service-work__body { padding:24px; }
.jjs-service-work__context { margin:0 0 10px; color:#805e00; font-size:12px; font-weight:800; letter-spacing:.06em; line-height:1.5; text-transform:uppercase; }
.jjs-service-work__title { margin:0 0 12px; color:#111; font-size:21px; font-weight:900; line-height:1.15; text-transform:uppercase; overflow-wrap:break-word; }
.jjs-service-work__description { margin:0; color:#555; font-size:15px; line-height:1.6; }
.jjs-service-work--single .jjs-service-work__grid { display:block; max-width:1100px; margin-inline:auto; }
.jjs-service-work--single .jjs-service-work__card { display:grid; grid-template-columns:1.1fr 1fr; align-items:center; }
.jjs-service-work--single .jjs-service-work__photo { aspect-ratio:auto; }
.jjs-service-work--single .jjs-service-work__capture { width:100%; }
.jjs-service-work--single .jjs-service-work__body { padding:clamp(24px,3vw,44px); }
@media (min-width:744px) and (max-width:1180px) {
 .jjs-service-work { padding:56px 22px; }
 .jjs-service-work__grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; }
 .jjs-service-work--five .jjs-service-work__card:nth-child(n) { grid-column:span 2; }
 .jjs-service-work--five .jjs-service-work__card:last-child { grid-column:2 / span 2; }
 .jjs-service-work--single .jjs-service-work__card { grid-template-columns:1fr 1fr; }
}
@media (max-width:743px) {
 .jjs-service-work { padding:52px 22px; }
 .jjs-service-work .jjs-service-work__grid { display:grid; grid-template-columns:minmax(0,1fr); gap:22px; }
 .jjs-service-work .jjs-service-work__card:nth-child(n) { display:flex; grid-column:auto; align-items:stretch; }
 .jjs-service-work__photo { aspect-ratio:auto; }
 .jjs-service-work__capture { width:100%; }
 .jjs-service-work .jjs-service-work__body { padding:22px; }
 .jjs-service-work__title { font-size:20px; }
}
