@font-face{font-family:"Raleway Case";src:url("raleway-reference.woff2") format("woff2");font-style:normal;font-weight:700;font-display:swap}
.project-case{--gallery-edge:3.149vw;--gallery-gap:1.049vw;background:#fff;color:#080808}
.project-case .case-header{position:fixed;top:0;left:0;right:0;z-index:10;min-height:32px;height:32px;padding:0 3%;background:#fff}
.project-case .case-header .brand{font-size:20px}
.project-case main{max-width:none}
.project-case .case-film{position:sticky;top:30px;z-index:0;display:flex;justify-content:center;width:100%;height:90vh;margin:0 auto;background:#fff}
.project-case .case-film video{display:block;width:auto;max-width:100%;height:90vh;max-height:none;aspect-ratio:auto;object-fit:contain}
.project-case .case-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:auto auto;align-content:center;column-gap:5%;row-gap:clamp(42px,5vw,88px);min-height:100svh;margin:0;padding:clamp(64px,8vh,120px) 7.8%;background:#fff}
.project-case .case-heading{display:contents}
.project-case .case-heading h1{grid-column:1/-1;margin:0;font-family:"Raleway Case",Raleway,Arial,sans-serif;font-size:clamp(46px,4.3vw,78px);line-height:1.1;font-weight:700;letter-spacing:normal}
.project-case .credits{grid-column:1;grid-row:2;align-self:baseline;margin:0;font-size:clamp(16px,1.2vw,19px);font-weight:700;line-height:1.65}
.project-case .credits span{color:inherit}
.project-case .case-copy{grid-column:2;grid-row:2;align-self:baseline;max-width:760px;margin:0;color:#111;font-size:clamp(17px,1.3vw,21px);line-height:1.65}
.project-case .case-copy p{margin:0}
.project-case .case-copy p+p{margin-top:1.4em}
.project-case .case-gallery{position:relative;display:flex;flex-direction:column;gap:var(--gallery-gap);max-width:none;margin:0;padding:0 var(--gallery-edge) clamp(70px,7vw,130px)}
.project-case .case-gallery-row{display:grid;gap:var(--gallery-gap);align-items:start}
.project-case .case-film+.case-gallery{z-index:1;margin-top:0;padding-top:var(--gallery-edge);background:#fff}
.project-case .case-gallery-row--three{grid-template-columns:repeat(3,minmax(0,1fr))}
.project-case .case-gallery-row--two{grid-template-columns:repeat(2,minmax(0,1fr))}
.project-case .case-gallery-row--one{grid-template-columns:minmax(0,1fr)}
.haddock-case .case-gallery-row--one{width:min(100%,1200px);margin-inline:auto}
.haddock-case .haddock-media-row video{display:block;width:100%;height:auto;min-width:0;background:#fff;border:0;clip-path:inset(0 2px)}
.haddock-case .haddock-media-row video:first-of-type{order:1}
.haddock-case .haddock-media-row .case-image{order:2}
.haddock-case .haddock-media-row video:last-of-type{order:3}
.estancia-case .estancia-row--wide-narrow{grid-template-columns:15fr 8fr}
.estancia-case .estancia-row--narrow-wide{grid-template-columns:8fr 15fr}
.estancia-case .estancia-row--final{grid-template-columns:2fr 1fr;align-items:stretch;height:90vh}
.estancia-case .estancia-row--final .case-image,.estancia-case .estancia-row--final .case-gallery-film{height:100%;min-height:0;overflow:hidden}
.estancia-case .case-gallery-film{display:flex;justify-content:center;background:#fff}
.estancia-case .case-gallery-film video{display:block;width:100%;max-width:100%;height:100%;object-fit:cover}
.project-case .case-gallery .case-image{position:relative;z-index:1;display:block;grid-column:auto;width:100%;height:auto;min-width:0;margin:0;padding:0;border:0;background:#fff;overflow:visible;cursor:zoom-in;user-select:none;-webkit-user-select:none;transition:transform 1200ms cubic-bezier(.215,.61,.355,1)}
.project-case .case-gallery .case-image img,.project-case .case-gallery .case-image:first-child img,.project-case .case-gallery .case-image:not(:first-child) img{display:block;width:100%;height:auto;max-height:none;min-height:0;aspect-ratio:auto;object-fit:contain;transition:none;user-select:none;-webkit-user-select:none;-webkit-user-drag:none}
.estancia-case .case-gallery .estancia-row--final .case-image img{height:100%;object-fit:cover}
.estancia-case .case-gallery .case-image img:is([src$="7f866b_24eedfdea5e047338c9b093cde849543~mv2.jpg"],[data-src$="7f866b_24eedfdea5e047338c9b093cde849543~mv2.jpg"],[data-full-src$="7f866b_24eedfdea5e047338c9b093cde849543~mv2.jpg"]){aspect-ratio:16/9;object-fit:cover;object-position:center}
.project-case .case-image:hover img{transform:none}
@media(hover:hover) and (pointer:fine){
 .project-case .case-gallery:has(.case-image:hover) .case-image:not(:hover):not(.case-image--neighbor){transform:scale(.988134765625)}
 .project-case .case-gallery .case-image--neighbor{transform:scale(.99208984375)}
 .project-case .case-gallery .case-image:hover{z-index:3;transform:scale(1.00791015625)}
}
.project-case .case-image:focus:not(:focus-visible){outline:none}
.project-case .next-case{margin-left:var(--gallery-edge);margin-right:var(--gallery-edge)}
dialog.project-viewer{position:fixed;inset:0;box-sizing:border-box;width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:20px;border:0;background:transparent;color:#111;overflow:hidden;user-select:none;-webkit-user-select:none}
.project-viewer::backdrop{background:transparent}
.project-viewer>.pv-curtain{position:absolute;inset:0;background:#fff;opacity:1}
.project-viewer>img:not(.pv-flying){position:relative;display:block;width:100%;height:100%;object-fit:contain}
.project-viewer>.pv-flying{position:fixed;z-index:3;display:block;object-fit:cover;pointer-events:none;max-width:none;max-height:none}
.project-viewer>button{position:absolute;z-index:2;display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;background:#ffffffd9;color:#111;font:36px/1 Arial,sans-serif;cursor:pointer}
.project-viewer>button:focus-visible{outline:2px solid #111;outline-offset:2px}
.project-viewer .pv-close{top:8px;right:12px}
.project-viewer .pv-prev{left:8px;top:calc(50% - 24px)}
.project-viewer .pv-next{right:8px;top:calc(50% - 24px)}
.project-viewer.pv-transitioning>img:not(.pv-flying),.project-viewer.pv-transitioning>button{visibility:hidden}
@media(max-width:700px){
 .project-case .case-header{height:44px;min-height:44px;padding:0 16px}
 .project-case .case-film{height:90vh}
 .project-case .case-intro{display:flex;flex-direction:column;gap:0;min-height:100svh;padding:clamp(74px,17vw,110px) 7% 50px}
 .project-case .case-heading{display:block}
 .project-case .case-heading h1{font-size:clamp(38px,10vw,56px)}
 .project-case .credits{margin:52px 0 0;font-size:16px}
 .project-case .case-copy{margin-top:44px;font-size:17px}
 .project-case .case-gallery{display:flex;gap:var(--gallery-gap);padding:0 var(--gallery-edge) 70px}
 .project-case .case-gallery-row,.project-case .case-gallery-row--three,.project-case .case-gallery-row--two{grid-template-columns:minmax(0,1fr);gap:var(--gallery-gap)}
 .estancia-case .estancia-row--wide-narrow,.estancia-case .estancia-row--narrow-wide,.estancia-case .estancia-row--final{grid-template-columns:minmax(0,1fr)}
 .estancia-case .estancia-row--final{height:auto}
 .estancia-case .estancia-row--final .case-image,.estancia-case .estancia-row--final .case-gallery-film{height:90vh}
 .project-case .next-case{margin-left:var(--gallery-edge);margin-right:var(--gallery-edge)}
 .project-viewer .pv-prev,.project-viewer .pv-next{top:auto;bottom:8px}
}
@media(max-width:640px){.project-case{--gallery-edge:14px;--gallery-gap:8px}}
@media(max-width:640px){.project-case .case-film{top:44px}}
/* Petrah shares the full-height text introduction used by the other cases. */
.petrah-case .case-intro{min-height:100svh}
.petrah-case .case-film{height:auto}
.petrah-case .case-film video{width:min(100%,160svh);height:auto;max-height:90svh;aspect-ratio:16/9;object-fit:contain}
.petrah-case .case-film+.case-gallery{margin-top:0;padding-top:var(--gallery-edge)}
.project-case:is(.petrah-case,.estancia-case) .case-film{--film-header:30px;--film-height:90vh;top:calc((100svh + var(--film-header) - var(--film-height)) / 2);height:var(--film-height);margin-bottom:24svh}
.project-case:is(.petrah-case,.estancia-case) .case-film video{width:calc(100% - 2 * var(--gallery-edge));height:100%;max-width:none;max-height:none;aspect-ratio:auto;object-fit:cover}
@media(max-width:750px){.project-case:is(.petrah-case,.estancia-case) .case-film{--film-height:56.25vw}}
@media(max-width:640px){.project-case:is(.petrah-case,.estancia-case) .case-film{--film-header:44px}}
@media(prefers-reduced-motion:reduce){.project-case .case-gallery .case-image{transition:none!important;transform:none!important}}


/* Loeb: equal image heights, with columns matching the original image ratios. */
@media(min-width:701px){
 .loeb-case .case-gallery-row--three{grid-template-columns:0.8fr 0.7500876271fr 1.7777777778fr}
}

/* Desktop enlarged gallery: bare controls in dedicated white margins. */
@media(min-width:641px){
 .project-viewer{padding:20px}
 .project-viewer button{background:transparent;border:0;box-shadow:none}
 .project-viewer .pv-close{top:4px;right:0;width:20px;height:28px;font-size:24px}
 .project-viewer .pv-prev,.project-viewer .pv-next{font-size:0;width:40px}
 .pv-prev::before{content:'‹';font:32px/1 Arial,sans-serif}
 .pv-next::before{content:'›';font:32px/1 Arial,sans-serif}
}

/* Desktop controls use fixed viewport gutters, independent of photo proportions. */
@media(min-width:641px){
 .project-viewer .pv-close{top:20px;right:0;width:20px;height:24px;font-size:0;align-items:start}
 .pv-close::before{content:'';display:block;width:10px;height:10px;background:linear-gradient(45deg,transparent 42%,#111 43%,#111 57%,transparent 58%),linear-gradient(-45deg,transparent 42%,#111 43%,#111 57%,transparent 58%)}
 .project-viewer .pv-prev,.project-viewer .pv-next{width:20px;top:50%;transform:translateY(-50%)}
 .project-viewer .pv-prev{left:0}
 .project-viewer .pv-next{right:0}
}

/* Center controls in the reference photo's white gutters, not at the viewport edges. */
@media(min-width:641px){
 .project-viewer{--control-gutter:max(20px,calc((100vw - (100dvh - 40px) * 16 / 9) / 2))}
 .project-viewer .pv-prev{left:calc((var(--control-gutter) - 20px) / 2)}
 .project-viewer .pv-next,.project-viewer .pv-close{right:calc((var(--control-gutter) - 20px) / 2)}
}


@media(max-width:640px){
 .project-viewer>img{touch-action:none}
 .project-viewer>.dialog__swipe-neighbor{z-index:1;max-width:none;max-height:none}
}