/* ---------- product pages (/work/<slug>) ---------- */
.case{position:relative;z-index:2;background:var(--night);color:var(--bone)}
.case__hero{min-height:100svh;display:grid;align-content:end;gap:22px;padding:18vh var(--gutter) 10vh calc(var(--gutter) + 210px);
  background:radial-gradient(90% 70% at 70% 20%,rgba(226,0,2,.16),transparent 60%),radial-gradient(80% 60% at 10% 90%,rgba(80,90,160,.18),transparent 60%)}
.case__back{margin:0}
.case__back a{font:600 14px/1 var(--sans);color:var(--bone);opacity:.7;text-decoration:none}
.case__back a:hover{opacity:1;color:var(--red-glow)}
.case__kicker{margin:0;font:500 1.05rem/1 var(--serif);letter-spacing:.14em;text-transform:uppercase;opacity:.7}
.case__title{margin:0;font:700 clamp(4.2rem,15vw,16rem)/.8 var(--sans);letter-spacing:-.055em}
.case__title .l{display:block;overflow:hidden;padding-bottom:.04em}
.case__title .l:nth-child(2){padding-left:1.1em;color:var(--red)}
.case__title .l>span{display:inline-block}
.case__lead{max-width:34ch;margin:10px 0 0;font:500 var(--t-sub)/1.18 var(--serif)}
.case__lead .swash{font-size:calc(var(--t-sub) * 2.3)}
.case__facts{display:grid;grid-template-columns:repeat(4,minmax(0,max-content));gap:10px 48px;margin:16px 0 0}
.case__facts dt{font:600 12px/1 var(--sans);letter-spacing:.08em;text-transform:uppercase;opacity:.55;margin:0 0 7px}
.case__facts dd{margin:0;font:600 16px/1.3 var(--sans)}
.case__tags{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 0}
.case__tags span{padding:7px 12px;border:1px solid rgba(246,243,236,.3);border-radius:999px;font:600 12px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase}
.case__cta{display:flex;flex-wrap:wrap;gap:10px;margin:8px 0 0}
.pill--ghost{background:transparent;color:inherit;box-shadow:inset 0 0 0 1px currentColor}
.case .pill{height:44px;padding:0 22px;font-size:15px}
.case__film{padding:6vh 0 16vh}
.film{position:relative;width:100%;margin:0 auto;border-radius:18px;overflow:hidden;background:#000;aspect-ratio:16/9;max-height:100svh;will-change:transform;
  box-shadow:0 0 0 1px rgba(246,243,236,.12),0 60px 140px rgba(0,0,0,.6)}
.film__video{display:block;width:100%;height:100%;object-fit:cover}
.film__sound{position:absolute;right:22px;bottom:20px;height:40px;padding:0 18px;border:0;border-radius:999px;background:rgba(246,243,236,.92);color:var(--ink);font:600 14px/1 var(--sans);cursor:pointer}
.film__sound[aria-pressed="true"]{background:var(--red);color:#fff}
.case__note{margin:18px var(--gutter) 0 calc(var(--gutter) + 210px);font:italic 500 1.1rem/1.4 var(--serif);opacity:.7}
.case__paper{padding-top:24vh;padding-bottom:26vh}
.case__sec{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(28px,5vw,96px);padding:9vh 0;border-top:1px solid rgba(26,26,24,.14)}
.case__sec:first-child{border-top:0;padding-top:0}
.case__head{position:sticky;top:14vh;align-self:start}
.case__num{margin:0 0 .9rem;font:500 1.3rem/1 var(--serif);letter-spacing:.1em;color:var(--ink-3)}
.case__h{margin:0;font:600 clamp(2rem,3.4vw,3.6rem)/1.02 var(--serif);letter-spacing:-.01em;color:var(--ink)}
.case__body{max-width:900px}
.case__body p{margin:0 0 1.1rem;max-width:56ch;font-size:clamp(1.1rem,1.3vw,1.3rem);line-height:1.6;color:var(--ink-2)}
.case__body p.case__first{font:500 clamp(1.45rem,2vw,2rem)/1.35 var(--serif);color:var(--ink);max-width:40ch}
.case__shots{display:grid;gap:18px;margin:2.4rem 0 0}
.case__shots--pair{grid-template-columns:1fr 1fr}
.case__shots--pair .shot:nth-child(3):last-child{grid-column:1/-1}
.shot{margin:0;border-radius:12px;overflow:hidden;background:#fff;box-shadow:0 20px 60px rgba(26,26,24,.16);cursor:zoom-in}
.shot img{display:block;width:100%;height:auto;transition:transform 1.2s cubic-bezier(.19,1,.22,1)}
.shot:hover img{transform:scale(1.025)}
.case__next a{position:relative;display:grid;align-content:end;gap:10px;min-height:88svh;padding:10vh var(--gutter) 10vh calc(var(--gutter) + 210px);color:var(--bone);text-decoration:none;overflow:hidden;isolation:isolate}
.case__next img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1;opacity:.38;transform:scale(1.06);transition:opacity .8s,transform 1.6s cubic-bezier(.19,1,.22,1)}
.case__next a::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,10,20,.2),var(--night) 92%)}
.case__next a:hover img{opacity:.6;transform:scale(1)}
.case__nextk{font:600 13px/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.case__nextn{font:700 clamp(3.4rem,10vw,10rem)/.86 var(--sans);letter-spacing:-.05em;transition:color .4s}
.case__next a:hover .case__nextn{color:var(--red-glow)}
.case__nextl{font:italic 500 var(--t-sub)/1.2 var(--serif);opacity:.85}
.case__audit{padding:18vh var(--gutter) 16vh calc(var(--gutter) + 210px)}
.case__audit .statement{font-size:clamp(2.4rem,5vw,5.2rem);max-width:18ch}
@media (max-width:820px){
  .case__hero,.case__next a,.case__audit{padding-left:var(--gutter)}
  .case__note{margin-left:var(--gutter)}
  .case__facts{grid-template-columns:1fr 1fr;gap:16px 24px}
  .case__sec{grid-template-columns:1fr;gap:18px}
  .case__head{position:static}
  .case__shots--pair{grid-template-columns:1fr}
  .film{border-radius:10px}
}
html[data-page=case] .index-pill,html[data-page=case] .index{display:none}