.portfolio{position:relative;padding:110px 0 36px;background:#0a0908;overflow:hidden}
.portfolio .portfolio-heading{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:18px 72px;align-items:end;margin-bottom:88px}
.portfolio-heading .portfolio-intro{grid-column:1/-1;margin:0;color:#c9a961;font-size:14px}
.portfolio-heading h2{max-width:800px;margin:0;font-size:clamp(42px,6vw,78px);line-height:1.02}
.portfolio-heading>p:last-child{max-width:390px;margin:0 0 7px;color:#a79d8e;font-size:16px;line-height:1.7}
.portfolio-cases{display:grid;gap:150px}
.case-study{position:relative}
.portfolio .case-copy{position:relative;z-index:3;margin-bottom:26px;display:grid;grid-template-columns:1fr 1fr;column-gap:48px;align-items:end}
.case-copy p{grid-column:1/-1;margin:0 0 10px;color:#c9a961;font-size:13px}
.case-copy h3{margin:0;color:#f0ead9;font-family:'Oswald',sans-serif;font-size:clamp(38px,5vw,66px);font-weight:600;line-height:1}
.case-copy span{max-width:480px;color:#a79d8e;font-size:15px;line-height:1.65}
.case-images{position:relative;width:min(1480px,94vw);height:clamp(510px,54vw,820px);margin-left:auto}
.case-reverse .case-images{margin-left:0;margin-right:auto}
.case-images figure{position:absolute;margin:0;background:#11100e;border:1px solid rgba(240,234,217,.14);box-shadow:0 36px 80px rgba(0,0,0,.48);overflow:hidden}
.case-images img{display:block;width:100%;height:100%;object-fit:cover;object-position:top left}
.case-primary{inset:0 0 9% 7%;border-radius:14px}
.case-secondary{left:0;bottom:0;width:46%;height:48%;border-radius:10px}
.case-reverse .case-primary{inset:0 7% 9% 0}
.case-reverse .case-secondary{right:0;left:auto}
.case-images figcaption{position:absolute;left:14px;bottom:14px;padding:8px 11px;background:rgba(8,8,7,.82);backdrop-filter:blur(7px);color:#d9d0c0;font-size:11px;border-left:1px solid #c9a961}
@media(max-width:900px){
  .portfolio{padding-top:78px}.portfolio .portfolio-heading{grid-template-columns:1fr;margin-bottom:58px}
  .portfolio-heading .portfolio-intro{grid-column:auto}.portfolio-heading>p:last-child{margin-top:4px}
  .portfolio-cases{gap:96px}.portfolio .case-copy{grid-template-columns:1fr;gap:12px}.case-copy p{grid-column:auto}
  .case-images,.case-reverse .case-images{width:100%;height:auto;margin:0;padding:0 20px;display:grid;gap:14px}
  .case-images figure,.case-primary,.case-secondary,.case-reverse .case-primary,.case-reverse .case-secondary{position:relative;inset:auto;left:auto;right:auto;bottom:auto;width:100%;height:auto;border-radius:9px}
  .case-images img{height:auto;aspect-ratio:16/9}.case-secondary{margin-left:8%;width:92%}
}