.client-case-main{padding:clamp(38px,6vw,90px) 28px clamp(88px,10vw,135px)}
.client-case-wrap{width:min(100%,1240px);margin:auto}
.client-case-back{display:inline-flex;align-items:center;min-height:42px;color:var(--p-muted);font-size:.82rem;font-weight:600;text-decoration:none}
.client-case-back:hover,.client-case-end a:hover{color:var(--p-green)}
.client-case-back:focus-visible,.client-case-end a:focus-visible,.client-case-piece button:focus-visible{outline:3px solid var(--p-green);outline-offset:4px}
.client-case-header{padding:clamp(60px,8vw,118px) 0 clamp(70px,9vw,112px)}
.client-case-header h1{max-width:1050px;margin:24px 0;font-size:clamp(4rem,10vw,8.8rem);font-weight:900;letter-spacing:-.082em;line-height:.93}
.client-case-header>p:not(.eyebrow){max-width:650px;color:var(--p-muted);font-size:clamp(1.05rem,1.7vw,1.25rem);line-height:1.6}
.client-case-header .tag-list{margin-top:32px}
.client-case-work{padding-top:34px;border-top:1px solid var(--p-line)}
.client-case-section-heading h2{margin:16px 0 32px;font-size:clamp(2.15rem,4.6vw,4rem);font-weight:900;letter-spacing:-.07em}
.client-case-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:start}
.client-case-piece{min-width:0;overflow:hidden;border:1px solid var(--p-line);border-radius:20px;background:var(--p-surface-2)}
.client-case-piece--landscape{grid-column:span 2}
.client-case-piece button{position:relative;width:100%;display:block;padding:0;border:0;overflow:hidden;background:#101f32;cursor:pointer}
.client-case-piece--portrait button{aspect-ratio:4/5}
.client-case-piece--landscape button{aspect-ratio:8/5}
.client-case-piece video{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.client-case-piece button:hover video{transform:scale(1.04)}
.client-case-play{position:absolute;right:16px;bottom:16px;width:45px;height:45px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.5);border-radius:50%;background:rgba(7,17,31,.7);color:#fff}
.client-case-piece>div{padding:17px 19px 21px}
.client-case-piece>div span{color:var(--p-green);font-size:.66rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase}
.client-case-piece h3{margin:8px 0 0;font-size:1.05rem;letter-spacing:-.02em}
.client-case-end{display:flex;justify-content:space-between;gap:20px;margin-top:clamp(65px,8vw,100px);padding-top:23px;border-top:1px solid var(--p-line)}
.client-case-end a{color:var(--p-white);font-size:.82rem;font-weight:600;text-decoration:none}
@media(max-width:900px){.client-case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.client-case-main{padding-right:20px;padding-left:20px}.client-case-header{padding-top:60px}.client-case-header h1{font-size:clamp(3.5rem,14vw,5.4rem)}.client-case-grid{gap:13px}.client-case-piece--landscape{grid-column:span 2}.client-case-end{flex-direction:column}}
