.project-detail-page .nav{position:fixed;inset:0 0 auto}
.case-hero{
  position:relative;isolation:isolate;display:grid;align-items:center;min-height:max(100svh,520px);
  margin-inline:calc(-1 * var(--pad));padding:84px var(--layout-edge) 96px;
  overflow:hidden;color:#fff;background:#111
}
.case-hero-media,.case-hero-media>*{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.case-hero-media{z-index:-2}
.case-hero::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(90deg,#0008,transparent 65%),linear-gradient(0deg,#000a,transparent 35%),linear-gradient(#0006,transparent 25%)
}
.case-hero h1{max-width:18ch;font:500 clamp(28px,3.1vw,48px)/1.02 Switzer,Arial,sans-serif;letter-spacing:-.045em}
.case-facts{
  position:absolute;left:var(--layout-edge);bottom:20px;display:flex;flex-wrap:wrap;
  gap:7px clamp(14px,2vw,32px);margin:0;max-width:calc(100% - 145px)
}
.case-facts div{display:flex;align-items:baseline;gap:7px}
.case-facts dt{font:500 11px Archivo,Arial,sans-serif;text-transform:uppercase}
.case-facts dd{margin:0;color:#e2e2e2;font-size:13px}
.case-cover-toggle{
  position:absolute;right:var(--layout-edge);bottom:17px;
  min-height:34px;border:1px solid #fff6;background:#0008;color:#fff;
  padding:5px 9px;cursor:pointer;font:500 11px Archivo,Arial,sans-serif
}
.case-description{padding-block:clamp(65px,8vw,120px);max-width:58ch}
.case-description h2{margin-bottom:20px;font:500 clamp(20px,2vw,30px)/1.05 Switzer,Arial,sans-serif;letter-spacing:-.04em}
.case-description p{margin:0 0 1em;line-height:1.32}
.case-description p:last-child{margin-bottom:0}
.case-description .case-lead{font-weight:500}
.case-media-gallery{display:grid;gap:var(--grid-gap)}
.case-media-gallery figure{margin:0;scroll-margin-top:70px}
.case-media-gallery :is(img,video){display:block;width:100%;height:auto}
.case-media-gallery video{background:#151515}
.interior-work.case-more{padding-top:0;margin-block:clamp(75px,9vw,145px)}
.case-more .section-head h2{font-size:clamp(26px,2.45vw,39px)}
.case-more .section-head .pill{text-transform:uppercase;font-size:11px}
@media(prefers-reduced-motion:no-preference){
  .case-hero h1,.case-facts{animation:case-intro .65s ease-out both}
  .case-facts{animation-delay:.12s}
  @keyframes case-intro{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
}
@media(max-width:600px){
  .case-facts{flex-direction:column;max-width:calc(100% - 114px)}
  .case-hero{padding-bottom:115px}
}