
:root{--case-accent:#B11226;--case-panel:var(--bg-tint);--case-tone:var(--ink)}
body.case-dark{--case-accent:#FEC422;--case-panel:#20201D;--case-tone:#E7E4D8}
.case-hero{position:relative;z-index:1;padding:152px var(--gutter) 64px;max-width:1500px;margin:auto}.case-hero h1{font:600 clamp(3rem,5vw,4.8rem)/1.04 var(--display);letter-spacing:-.045em;max-width:1100px}.case-hero h1 span{display:block;color:var(--case-accent)}.case-hero p{font:400 1.08rem/1.75 var(--sans);color:var(--ink-3);max-width:680px;margin-top:28px}
.case-feature-wrap{padding:0 var(--gutter) 70px;position:relative;z-index:1}.case-feature{max-width:1320px;margin:auto;display:grid;grid-template-columns:1.15fr 1fr;background:var(--bg-soft);border:1px solid var(--line);border-radius:12px;overflow:hidden;color:var(--ink);text-decoration:none}.feature-copy{padding:44px}.feature-copy h2{font:500 clamp(1.8rem,2.6vw,2.65rem)/1.12 var(--display);letter-spacing:-.03em;max-width:570px}.feature-copy p{margin:22px 0;color:var(--ink-3);font:400 1rem/1.75 var(--sans)}.case-read{display:inline-flex;gap:20px;align-items:center;font:600 .93rem var(--display);margin-top:18px;color:var(--ink)}.case-read span{transition:transform .2s}.case-feature:hover .case-read span,.library-card:hover .case-read span{transform:translateX(5px)}.feature-proof{background:var(--case-panel);padding:40px;display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden}.feature-proof::after{content:'';position:absolute;width:280px;height:280px;border:1px solid var(--line-strong);border-radius:50%;right:-90px;top:-120px;opacity:.6;pointer-events:none}.feature-proof strong{font:500 clamp(5rem,8vw,8.5rem)/1 var(--display);letter-spacing:-.065em;color:var(--case-accent)}.feature-proof>span{font:500 1.1rem var(--display);color:var(--ink-2);margin-top:12px}.feature-proof small{font:400 .9rem/1.5 var(--sans);color:var(--ink-3);border-top:1px solid var(--line-strong);padding-top:22px;margin-top:28px;max-width:350px}
.case-library{padding:0 var(--gutter) 80px;position:relative;z-index:1;scroll-margin-top:110px}.library-inner{max-width:1320px;margin:auto}.library-heading{font:500 clamp(2rem,3vw,2.8rem)/1.15 var(--display);letter-spacing:-.03em;margin-bottom:30px}.case-filters{display:flex;align-items:flex-end;gap:18px;padding-bottom:26px;border-bottom:1px solid var(--line);margin-bottom:30px}.case-filters label{display:flex;flex-direction:column;gap:8px;min-width:210px;font:500 .85rem var(--display);color:var(--ink-3)}.case-filters select,.case-filters input{height:46px;background:var(--bg-soft);color:var(--ink);border:1px solid var(--line-strong);border-radius:5px;padding:0 14px;font:400 .92rem var(--sans);width:100%;min-width:0}.case-search{flex:1}.case-count{font:400 .85rem var(--sans);color:var(--ink-3);padding-bottom:13px;white-space:nowrap}.library-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px 26px}.library-card{display:flex;flex-direction:column;min-width:0;color:var(--ink);text-decoration:none;background:var(--bg-soft);border:1px solid var(--line);border-radius:9px;overflow:hidden;transition:border-color .2s,transform .2s}.library-card[hidden]{display:none}.library-card:hover{border-color:var(--ink-4);transform:translateY(-4px)}.card-proof{height:194px;display:flex;flex-direction:column;justify-content:center;background:var(--case-panel);padding:28px;position:relative;border-bottom:1px solid var(--line)}.card-proof strong{font:500 clamp(2rem,3.5vw,3.5rem)/1.05 var(--display);letter-spacing:-.045em;color:var(--case-accent);position:relative}.card-proof span{max-width:270px;font:500 .88rem/1.5 var(--display);color:var(--ink-2);margin-top:13px}.card-body{padding:28px;display:flex;flex-direction:column;flex:1}.card-body h3{font:500 1.55rem/1.17 var(--display);letter-spacing:-.025em}.card-body p{font:400 .92rem/1.7 var(--sans);color:var(--ink-3);margin:16px 0 24px}.card-bottom{margin-top:auto;display:flex;justify-content:space-between;gap:10px;align-items:center;padding-top:18px;border-top:1px solid var(--line)}.card-bottom .case-read{margin:0;font-size:.85rem;white-space:nowrap}.case-sector{font:500 .77rem/1.4 var(--display);color:var(--ink-3)}.case-empty{padding:40px 0;color:var(--ink-3)}.case-cta{position:relative;z-index:1;border-top:1px solid var(--line);padding:60px var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:30px;background:var(--bg)}.case-cta h2{font:500 clamp(2rem,3vw,2.8rem)/1.1 var(--display);letter-spacing:-.03em}.case-cta p{margin-top:14px;color:var(--ink-3);font:400 1rem/1.7 var(--sans)}.case-cta .btn-primary{flex-shrink:0;font-family:var(--display)}
.case-back{display:inline-block;font:500 .92rem var(--display);color:var(--ink-3);text-decoration:none;margin-bottom:30px}.detail-hero{padding-bottom:45px}.detail-hero h1{font-size:clamp(2.5rem,4.5vw,4.1rem);max-width:1000px}.case-facts{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px;color:var(--ink-3);font:500 .84rem var(--display)}.case-facts span+span{border-left:1px solid var(--line-strong);padding-left:12px}.detail-wrap{position:relative;z-index:1;padding:0 var(--gutter) 72px}.detail-inner{max-width:1320px;margin:auto}.result-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:9px;overflow:hidden;margin-bottom:64px}.result-strip>div{padding:32px;background:var(--bg-soft)}.result-strip strong{display:block;font:500 clamp(2.1rem,3.5vw,3.5rem)/1.1 var(--display);letter-spacing:-.035em;color:var(--case-accent)}.result-strip span{display:block;margin-top:12px;color:var(--ink-3);font:400 .95rem/1.6 var(--sans);max-width:300px}.detail-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(250px,1fr);gap:80px}.detail-story section+section{margin-top:42px}.detail-story h2,.detail-aside h2{font:500 1.85rem/1.2 var(--display);letter-spacing:-.025em;margin-bottom:20px}.detail-story p,.detail-story li{font:400 1rem/1.85 var(--sans);color:var(--ink-3)}.detail-story p+p{margin-top:18px}.detail-story ul{padding-left:20px;display:grid;gap:14px}.detail-aside{align-self:start;background:var(--bg-soft);padding:30px;border:1px solid var(--line);border-radius:9px}.detail-aside h2{font-size:1.4rem}.tech-tags{list-style:none;display:flex;flex-wrap:wrap;gap:10px}.tech-tags li{font:400 .84rem/1.4 var(--sans);padding:8px 11px;border:1px solid var(--line-strong);border-radius:4px;color:var(--ink-2)}.detail-aside .case-read{margin-top:30px}.case-library :focus-visible,.case-feature:focus-visible,.case-back:focus-visible{outline:2px solid var(--case-accent);outline-offset:5px}
@media(max-width:1000px){.case-filters{flex-wrap:wrap}.case-search{min-width:200px}.library-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.feature-copy,.feature-proof{padding:32px}.detail-layout{gap:40px}.card-proof strong{font-size:3.1rem}}
@media(max-width:720px){.case-hero{padding-top:122px;padding-bottom:40px}.case-hero h1{font-size:clamp(2.65rem,9vw,3.5rem)}.case-hero p{font-size:1rem;margin-top:22px}.case-feature-wrap{padding-bottom:48px}.case-feature{grid-template-columns:1fr}.feature-copy{padding:28px}.feature-proof{padding:28px}.feature-proof strong{font-size:5.8rem}.feature-proof small{margin-top:20px;padding-top:18px}.library-grid{grid-template-columns:1fr;gap:24px}.case-filters{display:grid;grid-template-columns:1fr;gap:16px}.case-filters label{min-width:0}.case-count{padding:0}.library-heading{font-size:2rem}.card-proof{height:180px}.card-proof strong{font-size:3.35rem}.card-body{padding:26px}.case-library{padding-bottom:48px}.case-cta{display:block;padding-top:42px;padding-bottom:42px}.case-cta .btn-primary{margin-top:22px}.detail-layout{grid-template-columns:1fr;gap:36px}.result-strip{grid-template-columns:1fr;margin-bottom:40px}.result-strip>div{padding:26px}.result-strip strong{font-size:2.8rem}.detail-wrap{padding-bottom:44px}.detail-hero h1{font-size:2.6rem}}
@media(prefers-reduced-motion:reduce){.library-card,.case-read span{transition:none}.library-card:hover{transform:none}}

.card-proof strong.word-metric{font-size:clamp(1.9rem,2.6vw,2.7rem)}
.library-heading{scroll-margin-top:108px}
.library-heading:focus{outline:none}
.case-pagination{display:flex;justify-content:center;align-items:center;gap:20px;margin-top:38px;padding-top:28px;border-top:1px solid var(--line)}
.case-pagination[hidden]{display:none}
.case-page-numbers{display:flex;gap:8px}
.case-pagination button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:44px;min-height:44px;padding:10px 14px;border:1px solid var(--line-strong);border-radius:5px;background:var(--bg-soft);color:var(--ink-2);font:600 .94rem/1.3 var(--display);cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.case-pagination button:hover:not(:disabled){border-color:var(--case-accent);color:var(--case-accent)}
.case-pagination button[aria-current=page],.case-pagination button[aria-current=page]:hover{background:var(--case-accent);border-color:var(--case-accent);color:var(--bg)}
.case-pagination button:disabled{opacity:.38;cursor:default}
@media(max-width:540px){.case-pagination{flex-wrap:wrap;gap:16px;margin-top:28px}.case-page-numbers{order:-1;flex-basis:100%;justify-content:center}.case-pagination>button{min-width:120px}}
@media(prefers-reduced-motion:reduce){.case-pagination button{transition:none}}
@media(max-width:720px){.card-proof strong.word-metric{font-size:2.35rem}}

/* Shared image-led hero: follows the About and Industries page proportions. */
.case-image-hero{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:44px;padding-top:132px;padding-bottom:62px;max-width:none;min-height:600px}
.case-image-hero h1{font-size:clamp(2.8rem,4.6vw,4.2rem);line-height:1.04;letter-spacing:-.035em;max-width:660px}
.case-image-hero p{max-width:565px;font-size:1.05rem;line-height:1.75;margin-top:28px}
.case-hero-copy{position:relative;z-index:2}
.case-hero-image{position:relative;align-self:stretch;min-height:430px;margin:0 -28px 0 -22px;overflow:hidden}
.case-hero-image img{display:block;width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:42% center;filter:grayscale(1);opacity:.9}
.case-hero-image::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,var(--bg) 0%,transparent 27%,transparent 77%,var(--bg) 100%),linear-gradient(180deg,var(--bg) 0%,transparent 22%,transparent 70%,var(--bg) 100%)}
.case-image-hero+.case-feature-wrap .feature-proof strong{font-size:clamp(4.8rem,7.3vw,7.5rem)}
@media(min-width:1500px){.case-hero-image{margin-right:0}}
@media(max-width:1000px) and (min-width:721px){.case-image-hero{gap:26px;min-height:550px}.case-image-hero h1{font-size:clamp(2.5rem,4.6vw,3rem)}.case-hero-image{min-height:390px}.case-image-hero+.case-feature-wrap .feature-proof strong{font-size:4.8rem}}
@media(max-width:720px){.case-image-hero{grid-template-columns:1fr;gap:14px;min-height:0;padding-top:124px;padding-bottom:30px}.case-image-hero h1{font-size:clamp(2.5rem,9vw,3.2rem)}.case-image-hero p{font-size:1rem;margin-top:24px}.case-hero-image{min-height:0;aspect-ratio:1.35;width:calc(100% + 48px);margin:0 -24px}.case-hero-image img{object-position:center}.case-image-hero+.case-feature-wrap .feature-proof strong{font-size:clamp(3.7rem,17vw,5.8rem)}}

.case-image-hero h1 span.case-hero-neutral{display:inline;color:var(--ink)}

/* Keep the client workshop in focus while blending the photograph into each theme. */
.case-hero-image img{object-position:50% 78%;transform:scale(1.2);transform-origin:50% 90%}
.case-hero-image::after{background:linear-gradient(90deg,var(--bg) 0%,transparent 21%,transparent 84%,var(--bg) 100%),linear-gradient(180deg,var(--bg) 0%,transparent 18%,transparent 83%,var(--bg) 100%)}

/* One layered composition on phones; content determines height at larger text sizes. */
@media(max-width:720px){
 .case-image-hero{display:grid;grid-template-columns:minmax(0,1fr);align-items:end;isolation:isolate;gap:0;min-height:610px;padding:192px var(--gutter) 48px;margin-bottom:24px;overflow:hidden}
 .case-image-hero .case-hero-copy{grid-area:1/1;z-index:2;min-width:0}
 .case-image-hero h1{font-size:clamp(2.1rem,8.8vw,2.75rem);line-height:1.07;letter-spacing:-.035em;max-width:540px;text-wrap:balance}
 .case-image-hero p{font-size:.98rem;line-height:1.7;margin-top:22px;max-width:490px;color:var(--ink-2)}
 .case-image-hero .case-hero-image{position:absolute;inset:76px 0 0;z-index:0;width:auto;min-height:0;height:auto;aspect-ratio:auto;margin:0;pointer-events:none}
 .case-image-hero .case-hero-image img{width:100%;height:100%;object-fit:cover;object-position:64% 65%;opacity:1;transform:scale(1.08);transform-origin:60% 65%}
 .case-image-hero .case-hero-image::after{background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 20%,transparent) 0%,color-mix(in srgb,var(--bg) 35%,transparent) 25%,color-mix(in srgb,var(--bg) 88%,transparent) 56%,var(--bg) 100%),linear-gradient(90deg,color-mix(in srgb,var(--bg) 42%,transparent),transparent 90%)}
}
@media(max-width:720px){.case-image-hero .case-hero-image img{transform:scale(1.65);transform-origin:58% 100%;object-position:58% 100%}}

/* Case study detail: headline result in the hero, sticky side panel, service link and related cases */
.case-facts a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--case-accent);text-underline-offset:4px;border-left:1px solid var(--line-strong);padding-left:12px}
.case-facts a:hover{color:var(--case-accent)}
.case-key-result{display:flex;align-items:baseline;flex-wrap:wrap;gap:14px;margin-top:30px;padding-top:24px;border-top:1px solid var(--line-strong);max-width:760px}
.case-key-result strong{font:600 clamp(2.4rem,4vw,3.4rem)/1 var(--display);letter-spacing:-.04em;color:var(--case-accent)}
.case-key-result span{font:500 1.05rem/1.45 var(--display);color:var(--ink-2)}
@media(min-width:901px){.detail-aside{position:sticky;top:100px}}
.case-service{margin-top:24px;font-size:.92rem;line-height:1.6;color:var(--ink-3)}
.case-service a{display:block;margin-top:4px;font:600 1rem var(--display);color:var(--ink);text-decoration:none}
.case-service a:hover{color:var(--case-accent)}
.case-more{max-width:calc(1320px + 2 * var(--gutter));margin:0 auto;padding:24px var(--gutter) 72px}
.case-more h2{font:600 clamp(1.7rem,2.6vw,2.4rem)/1.1 var(--display);letter-spacing:-.03em;margin-bottom:24px}
.case-more-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.case-more-card{display:flex;flex-direction:column;gap:8px;padding:26px;border:1px solid var(--line-strong);border-radius:10px;background:var(--bg-soft);color:var(--ink);text-decoration:none;transition:border-color .2s}
.case-more-card:hover,.case-more-card:focus-visible{border-color:var(--case-accent)}
.case-more-card span{font:500 .8rem var(--display);color:var(--ink-3)}
.case-more-card strong{font:600 2.2rem/1 var(--display);letter-spacing:-.035em;color:var(--case-accent);margin-top:6px}
.case-more-card em{font-style:normal;font-size:.9rem;color:var(--ink-3)}
.case-more-card h3{font:500 1.15rem/1.35 var(--display);margin-top:10px}
@media(max-width:720px){.detail-hero h1{font-size:clamp(2rem,8vw,2.4rem)}.case-key-result{margin-top:22px;padding-top:18px}.case-more{padding-bottom:48px}.case-more-grid{grid-template-columns:minmax(0,1fr)}}
.case-clear{margin-left:8px;min-height:40px;padding:8px 16px;border:1px solid var(--line-strong);border-radius:8px;background:transparent;color:var(--ink);font:600 .9rem var(--display);cursor:pointer}.case-clear:hover,.case-clear:focus-visible{border-color:var(--case-accent);color:var(--case-accent)}
