/* Only the Work index and its two case-study routes load this stylesheet. */
/* Let wrapped copy determine hero height between desktop and mobile. */
@media(min-width:701px) and (max-width:900px){.hero.case-hero{aspect-ratio:auto}}
.company-logo.grainger{filter:url(#work-grainger-ink)}
.work-list-item h2 a{text-decoration:none}
.work-hero{min-height:0;aspect-ratio:4.85;grid-template-columns:68% 32%}
.work-hero .hero-copy{padding:4.5% 0 3.5% 5%}
.work-hero h1{font-size:clamp(36px,4.4vw,62px);line-height:1.05;white-space:nowrap}
.work-hero p{font-size:clamp(17px,1.8vw,23px);line-height:1.25;max-width:95%;margin:0}
.work-hero .hero-art{width:32%;object-position:center}
.index-title{display:flex;align-items:center;gap:25px;margin:26px 24px 0;font-size:46px}
.index-title:after{content:'';height:1px;flex:1;background:var(--line)}
.work-list-item{grid-template-columns:1fr 1fr;gap:45px;padding:24px}
.work-list-item>img{aspect-ratio:1.46;object-fit:cover;height:auto;align-self:center}
.work-list-item h2{font-size:clamp(29px,3.4vw,42px);margin:15px 0}
.work-list-item p{font-size:18px;line-height:1.3}
.work-list-item .company-logo{height:83px;max-width:185px;margin:0}
.work-list-item .company-logo.grainger{height:56px;margin:0 0 20px}
.work-list-item .eyebrow{font-size:11px;line-height:1.5;letter-spacing:2px}
.case-hero{grid-template-columns:43.5% 56.5%;min-height:0;aspect-ratio:2.53}
.case-hero .hero-copy{padding:12% 5% 8% 6%}
.case-hero h1{font-size:clamp(45px,6.1vw,78px);line-height:.94;letter-spacing:-1px;margin-bottom:18px}
.case-hero p{font-size:clamp(17px,1.8vw,23px);line-height:1.22;font-style:italic;max-width:92%;margin:0}
.case-hero .hero-art{width:56.5%;object-position:center;object-fit:cover}
.grainger-hero{grid-template-columns:47% 53%;aspect-ratio:2.72}
.grainger-hero .hero-art{width:53%}
.grainger-hero h1{font-size:clamp(40px,5.5vw,72px)}
.case-metrics{grid-template-columns:16% 27% 27% 30%;gap:0;padding:20px 10px}
.metric{padding:0 15px;gap:14px;min-width:0}
.metric strong{font-size:34px;white-space:nowrap}
.metric p{font-size:15px;line-height:1.15;margin-bottom:0}
.metric-icon{width:42px;height:42px;flex-shrink:0}
.case-logo .company-logo{height:80px;max-width:100%;margin:0}
.case-logo .company-logo.grainger{height:47px;padding:0 20px 0 0}
.editorial-section{grid-template-columns:16% minmax(0,1fr);gap:22px;padding:22px 14px}
.section-body h3,.story-intro h3{font-size:clamp(26px,3vw,36px);line-height:1.08;margin-bottom:8px}
.section-body p,.story-intro p{font-size:18px;line-height:1.28;margin-bottom:0}
.section-marker h2{font-size:24px;line-height:1.07}
.number{font-size:66px;line-height:.95}
.tiles{gap:18px;margin-top:0}
.tiles article>img{aspect-ratio:1.8;object-fit:cover}
.tiles h3{font-size:24px;margin-bottom:6px}
.tiles p{font-size:17px;line-height:1.2}
.outcomes>div{grid-template-columns:35px 1fr 1.55fr;gap:16px;padding:10px 0}
.outcomes h3{font-size:23px;margin:0}
.outcomes p{font-size:17px;line-height:1.2}
.full-story{grid-template-columns:16% minmax(0,1fr)}
.story-text h4{font-size:29px;margin:20px 0 6px}
.story-text p{font-size:18px;line-height:1.3;margin-bottom:10px}
.chapter-index a{font-size:15px;line-height:1.25}
.next-case>img{object-fit:cover}
.next-case>img,.page-work .closing>img{content:url('/assets/case-closing-approved.webp')}
@media(min-width:701px){.work-hero h1{font-size:clamp(44px,5.5vw,76px);transform:scaleX(.8);transform-origin:left;width:125%}}
@media(min-width:701px){.case-hero h1{font-size:clamp(55px,7.6vw,96px);transform:scaleX(.8);transform-origin:left;width:125%;line-height:.92}.grainger-hero h1{font-size:clamp(48px,6.5vw,84px)}}
@media(min-width:701px) and (max-width:1000px){
 .case-hero h1{font-size:clamp(45px,6vw,61px)}.case-hero p{font-size:18px}
 .metric{padding:0 10px;gap:10px}.metric strong{font-size:29px}.metric p{font-size:14px}.metric-icon{width:32px;height:32px}
 .work-hero h1{font-size:4.2vw}.work-list-item{gap:30px;padding:24px 15px}.work-list-item p{font-size:17px}
}
@media(max-width:700px){.breadcrumb{margin-bottom:9px}
 .work-hero{aspect-ratio:auto;display:block;position:relative;min-height:230px}
 .work-hero .hero-copy{padding:25px 23px 90px;max-width:100%}.work-hero h1{font-size:36px;white-space:normal;max-width:90%}.work-hero p{font-size:18px;max-width:90%}
 .work-hero .hero-art{position:absolute;bottom:0;right:0;top:auto;width:34%;height:95px;aspect-ratio:auto;object-fit:cover}
 .index-title{font-size:34px;margin:24px 0 0;gap:15px}
 .work-list-item{grid-template-columns:43% minmax(0,1fr);gap:20px;padding:24px 0}
 .work-list-item>img{height:100%;max-height:320px;aspect-ratio:1;object-fit:cover;align-self:stretch}
 .work-list-item .company-logo{height:59px;max-width:145px}.work-list-item .company-logo.grainger{height:40px;margin:0 0 12px}
 .work-list-item h2{font-size:27px;margin:12px 0}.work-list-item p{font-size:16px;line-height:1.25}.work-list-item .eyebrow{font-size:10px;letter-spacing:1px;margin-bottom:12px}
 .work-list-item .button{font-size:16px;padding:10px 15px}
 .case-hero{display:block;aspect-ratio:auto;background:#0b3b56}
 .case-hero .hero-copy{padding:24px 22px 0}
 .case-hero h1{font-size:clamp(37px,8vw,52px);line-height:.94;margin-bottom:12px;max-width:none}
 .case-hero p{font-size:17px;line-height:1.15;max-width:48%;padding-bottom:0}
 .case-hero .hero-art{position:relative;display:block;width:100%;height:auto;min-height:0}
 .usaa-hero .hero-art{aspect-ratio:1.832;object-fit:contain;margin-top:-40px}
 .grainger-hero .hero-art{aspect-ratio:2.1;object-position:center;margin-top:-25px}
 .grainger-hero p{max-width:63%;margin-bottom:32px}
 .case-metrics{grid-template-columns:16% 27% 27% 30%;padding:15px 0}
 .case-logo .company-logo{width:100%;height:56px;padding-right:12px}.case-logo .company-logo.grainger{height:37px;padding-right:9px}
 .metric{display:flex;gap:9px;padding:0 9px;align-items:flex-start}.metric-icon{width:27px;height:27px;margin:5px 0 0}.metric strong{font-size:23px;line-height:1;margin-bottom:5px}.metric p{font-size:12px;line-height:1.1}
 .editorial-section,.full-story{grid-template-columns:17% minmax(0,1fr);gap:18px;padding:18px 0}
 .section-marker{padding-right:10px}.section-marker h2{font-size:20px;overflow-wrap:normal}.number{font-size:51px;margin-bottom:4px}
 .section-body h3,.story-intro h3{font-size:25px;line-height:1.05}.section-body p,.story-intro p{font-size:16px;line-height:1.2}
 .tiles{margin:0}.tiles article{grid-template-columns:40% minmax(0,1fr);gap:14px;margin:0 0 8px;padding-bottom:8px}.tiles article>img{height:100%;max-height:145px;aspect-ratio:1.85;object-fit:cover}.tiles h3{font-size:21px;line-height:1.05;margin-bottom:6px}.tiles p{font-size:15px;line-height:1.15}
 .outcomes>div{grid-template-columns:26px 1fr 1.3fr;gap:9px;padding:9px 0}.outcomes h3{font-size:18px}.outcomes p{grid-column:auto;font-size:14px;padding-left:10px;border-left:1px solid var(--line)}
 .chapter-index{grid-template-columns:repeat(3,minmax(0,1fr));gap:0;padding:22px 0 12px}.chapter-index a{font-size:14px;line-height:1.15;padding:9px}.chapter-index h3{font-size:14px}
 .story-text{padding:0 7px}.story-text p{font-size:17px;line-height:1.4}.story-text h4{font-size:26px;margin-top:22px}
 .next-case{grid-template-columns:58% 42%}.next-case>img{height:100%;object-position:20% center}.next-case>div{padding:16px}.next-case h2{font-size:27px;margin-bottom:10px}.next-case .button{font-size:15px;padding:10px 13px}
}
@media(max-width:430px){
 .work-list-item{grid-template-columns:1fr;gap:18px}.work-list-item>img{aspect-ratio:1.8;height:auto;max-height:240px}.work-list-item h2{font-size:29px}.work-list-item>div{display:grid;grid-template-columns:78px 1fr;gap:12px}.work-list-item .company-logo{height:58px;grid-column:1;grid-row:1}.work-list-item .company-logo.grainger{height:35px;max-width:78px}.work-list-item h2{grid-column:2;margin:0;font-size:27px}.work-list-item p,.work-list-item .button{grid-column:1/-1;margin:0}.work-list-item .button{justify-self:start}
 .work-list-item>img{object-position:center top}
 .case-hero .hero-copy{padding:22px 18px 0}.case-hero p{max-width:65%;font-size:17px}.usaa-hero .hero-art{margin-top:-25px}.grainger-hero p{max-width:85%;margin-bottom:18px}.grainger-hero .hero-art{margin-top:0}
 .case-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:15px 0}.case-logo .company-logo{width:auto;height:62px;margin-left:8px}.case-logo .company-logo.grainger{width:125px;height:40px}.metric{padding:0 12px;gap:10px}.metric p{font-size:14px;line-height:1.2}.metric strong{font-size:25px}.metric-icon{width:29px;height:29px}
 .editorial-section,.full-story{grid-template-columns:70px minmax(0,1fr);gap:12px}.number{font-size:46px}.section-marker h2{font-size:17px}.section-body h3,.story-intro h3{font-size:23px}
 .tiles article{grid-template-columns:1fr;gap:8px;padding-bottom:15px;margin-bottom:15px}.tiles article>img{width:100%;height:auto;aspect-ratio:2;max-height:145px}.tiles h3{font-size:23px}.tiles p{font-size:16px;line-height:1.25}
 .outcomes>div{grid-template-columns:24px 1fr;gap:8px}.outcomes p{grid-column:2;border:0;padding:0;font-size:16px}.outcomes h3{font-size:20px}.chapter-index{grid-template-columns:1fr 1fr}
 .next-case{grid-template-columns:1fr 28%}.next-case h2{font-size:25px}.next-case>div{padding:16px 12px}
}

/* Responsive sources keep the existing image in its original layout slot. */
.hero-picture{display:contents}