body.project-gallery-open{overflow:hidden}
.portfolio-gallery{padding:0 80px 80px;max-width:1440px;margin:0 auto}
.project-showcase{display:grid;grid-template-columns:280px minmax(0,1fr);gap:30px;align-items:start;min-height:calc(100vh - 100px);padding:28px 0 72px;border-bottom:1px solid rgba(255,255,255,.06)}
.pg-spec{position:sticky;top:92px;padding-top:6px}
.pg-spec::before{content:"";display:block;width:42px;height:1px;background:rgba(255,255,255,.28);margin-bottom:24px}
.pg-spec h2{margin:0 0 34px;font-family:Montserrat,sans-serif;font-size:32px;line-height:.95;font-weight:700;letter-spacing:-1px;color:#fff}
.pg-row{display:block;padding:0 0 18px}
.pg-row b,.pg-row span{display:block;text-transform:uppercase}
.pg-row b{margin-bottom:7px;color:rgba(255,255,255,.34);font-size:8px;font-weight:600;line-height:1;letter-spacing:3px}
.pg-row span{color:rgba(255,255,255,.76);font-size:10px;font-weight:700;line-height:1.35;letter-spacing:2.4px;text-align:left}
.pg-stage{position:relative}
.pg-featured{position:relative;display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:auto;gap:10px}
.pg-featured.layout-wide{grid-template-columns:1fr 1fr}
.pg-featured.layout-mixed{grid-template-columns:1.38fr .72fr;grid-template-rows:310px 310px}
.pg-featured.layout-tall{grid-template-columns:.78fr 1.22fr;grid-template-rows:310px 310px}
.pg-shot{position:relative;overflow:hidden;min-height:260px;background:#17181c;cursor:pointer;border:0;padding:0;color:#fff}
.pg-shot:hover .pg-shot-main{transform:scale(1.018)}
.pg-featured.layout-wide .pg-shot{aspect-ratio:16/9}
.pg-featured.layout-wide .pg-shot.is-featured-wide{grid-column:1/-1;aspect-ratio:21/9}
.pg-featured.layout-mixed .is-featured-tile,.pg-featured.layout-tall .is-featured-tile{grid-row:1/span 2}
.pg-featured.layout-mixed .pg-shot:not(.is-featured-tile),.pg-featured.layout-tall .pg-shot:not(.is-featured-tile){min-height:305px}
.pg-shot-bg{position:absolute;inset:-8%;width:116%;height:116%;object-fit:cover;filter:blur(24px) brightness(.5) saturate(.9);transform:scale(1.08)}
.pg-shot-main{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:transparent;transition:transform .7s cubic-bezier(.16,1,.3,1)}
.pg-shot.needs-contain .pg-shot-main{object-fit:contain}
.pg-shot::after{content:attr(data-label);position:absolute;left:16px;bottom:14px;color:rgba(255,255,255,.62);font-size:8px;font-weight:700;letter-spacing:2.8px;text-transform:uppercase}
.pg-open-next{position:absolute;right:28px;bottom:28px;z-index:4;width:104px;height:104px;border:1px solid rgba(255,255,255,.30);background:rgba(0,0,0,.24);backdrop-filter:blur(8px);cursor:pointer;display:grid;place-items:center;color:#fff;transition:background .22s,border-color .22s,transform .22s}
.pg-open-next:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.6)}
.pg-open-next:active{transform:scale(.96)}
.pg-open-next svg{width:44px;height:44px;fill:none;stroke:rgba(255,255,255,.86);stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.pg-open-next span{position:absolute;left:50%;bottom:-26px;transform:translateX(-50%);white-space:nowrap;color:rgba(255,255,255,.42);font-size:8px;font-weight:700;letter-spacing:2.4px;text-transform:uppercase}
.pg-extra{margin-top:28px}
.pg-extra iframe{display:block;width:100%;min-height:560px;border:0;background:#111}
.project-gallery-viewer{display:none;position:fixed;inset:0;z-index:9000;background:#07080a}
.project-gallery-viewer.open{display:block}
.pg-slide{position:absolute;inset:0;opacity:0;transition:opacity .45s ease;background:#07080a}
.pg-slide.active{opacity:1}
.pg-fs-bg{position:absolute;z-index:0;inset:-8%;width:116%;height:116%;object-fit:cover;filter:blur(32px) brightness(.5) saturate(.95);transform:scale(1.1)}
.pg-fs-main{position:absolute;z-index:1;inset:0;width:100%;height:100%;object-fit:contain;background:transparent}
.pg-slide.has-next .pg-fs-main{right:360px;width:calc(100% - 360px)}
.pg-slide.has-next::after{content:"";position:absolute;z-index:3;top:0;right:330px;width:190px;height:100%;background:linear-gradient(to right,rgba(7,8,10,0),rgba(7,8,10,.72) 58%,rgba(7,8,10,.96));pointer-events:none}
.pg-next-peek{position:absolute;z-index:4;top:0;right:0;width:360px;height:100%;border-left:1px solid rgba(255,255,255,.08);background:rgba(8,9,12,.92);display:grid;grid-template-rows:1fr auto}
.pg-next-peek img{width:100%;height:100%;object-fit:cover;filter:brightness(.82)}
.pg-next-media{overflow:hidden;position:relative}
.pg-next-media::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(8,9,12,.06),rgba(8,9,12,.58) 82%,rgba(8,9,12,.94))}
.pg-next-copy{padding:24px 108px 28px 24px;background:rgba(8,9,12,.94);min-height:168px}
.pg-next-copy span{display:block;margin-bottom:12px;color:rgba(255,255,255,.42);font-size:8px;font-weight:700;letter-spacing:2.8px;text-transform:uppercase}
.pg-next-copy h3{margin:0;font-family:Montserrat,sans-serif;font-size:26px;line-height:1;font-weight:700;letter-spacing:-1px;color:#fff}
.pg-next-copy p{margin:12px 0 0;color:rgba(255,255,255,.44);font-size:8px;font-weight:700;letter-spacing:2px;text-transform:uppercase;line-height:1.55}
.pg-ui{position:absolute;z-index:3;inset:0;pointer-events:none}
.pg-project-gradient{position:absolute;z-index:2;top:0;left:0;width:min(430px,42vw);height:100%;padding:36px 32px;display:flex;flex-direction:column;justify-content:flex-start;background:linear-gradient(to right,rgba(7,8,10,.88),rgba(7,8,10,.62) 62%,rgba(7,8,10,0));opacity:0;transform:translateX(-18px);transition:opacity .35s ease,transform .45s cubic-bezier(.16,1,.3,1);pointer-events:none}
.project-gallery-viewer.show-project-info .pg-project-gradient{opacity:1;transform:translateX(0)}
.pg-project-gradient h3{margin:0 0 28px;font-family:Montserrat,sans-serif;font-size:30px;line-height:.95;font-weight:700;letter-spacing:-1px;color:#fff}
.pg-info-row{margin-bottom:18px}
.pg-info-row b,.pg-info-row span{display:block;text-transform:uppercase}
.pg-info-row b{margin-bottom:7px;color:rgba(255,255,255,.38);font-size:8px;font-weight:700;letter-spacing:2.8px}
.pg-info-row span{color:rgba(255,255,255,.8);font-size:10px;font-weight:700;letter-spacing:2.2px;line-height:1.35}
.pg-top{position:absolute;top:28px;right:32px;display:flex;justify-content:flex-end}
.pg-close{pointer-events:auto;width:48px;height:48px;border:1px solid rgba(255,255,255,.24);background:rgba(0,0,0,.18);cursor:pointer;font-size:28px;line-height:1;display:grid;place-items:center;color:#fff}
.pg-bottom{position:absolute;left:32px;right:32px;bottom:28px;display:flex;align-items:end;justify-content:space-between;gap:24px}
.pg-caption{font-size:9px;font-weight:700;letter-spacing:2.6px;text-transform:uppercase;color:rgba(255,255,255,.66)}
.pg-count{margin-top:10px;color:rgba(255,255,255,.42);font-size:9px;font-weight:700;letter-spacing:2.4px;text-transform:uppercase;font-variant-numeric:tabular-nums}
.pg-fs-arrows,.pg-next-arrows{pointer-events:auto;display:flex;gap:10px}
.pg-next-arrows{position:absolute;z-index:6;right:20px;bottom:28px;flex-direction:column}
.pg-next-arrows .pg-fs-arrow{width:52px;height:52px}
.project-gallery-viewer.on-last .pg-bottom>.pg-fs-arrows{display:none}
.pg-fs-arrow{width:58px;height:58px;border:1px solid rgba(255,255,255,.24);background:rgba(0,0,0,.18);cursor:pointer;display:grid;place-items:center;color:#fff;transition:background .2s,border-color .2s,transform .2s}
.pg-fs-arrow:hover,.pg-close:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.48)}
.pg-fs-arrow:active,.pg-close:active{transform:scale(.96)}
.pg-fs-arrow svg{width:22px;height:22px;fill:none;stroke:rgba(255,255,255,.84);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.pg-bar{position:absolute;left:32px;right:32px;bottom:0;height:2px;background:rgba(255,255,255,.12)}
.pg-fill{height:100%;width:0;background:rgba(255,255,255,.72);transition:width .25s ease}
@media(max-width:900px){
  .portfolio-gallery{padding:0 32px 60px}
  .project-showcase{display:block;min-height:0;padding:16px 0 56px}
  .pg-spec{position:static;display:grid;grid-template-columns:minmax(220px,300px) minmax(120px,1fr);column-gap:28px;margin-bottom:22px;padding-top:0;align-items:start}
  .pg-spec::before{grid-column:1;width:34px;margin-bottom:18px}
  .pg-spec h2{grid-column:1;grid-row:auto;font-size:30px;margin:0 0 18px;text-align:left}
  .pg-row{grid-column:1;display:block;justify-self:start;width:100%;padding:0 0 12px;text-align:left}
  .pg-row b{margin:0 0 6px;font-size:8px;letter-spacing:2.4px;text-align:left}
  .pg-row span{font-size:9px;letter-spacing:2px;text-align:left}
  .pg-featured,.pg-featured.layout-wide,.pg-featured.layout-mixed,.pg-featured.layout-tall{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto;gap:6px}
  .pg-featured .pg-shot,.pg-featured.layout-wide .pg-shot,.pg-featured.layout-mixed .pg-shot,.pg-featured.layout-tall .pg-shot{display:block;width:100%;height:auto;min-height:0;margin:0;aspect-ratio:4/3;grid-column:auto;grid-row:auto}
  .pg-featured.layout-wide .pg-shot.is-featured-wide{grid-column:1/-1;grid-row:auto;aspect-ratio:16/9}
  .pg-featured.layout-mixed .is-featured-tile,.pg-featured.layout-tall .is-featured-tile{grid-column:1/-1;grid-row:auto;aspect-ratio:16/9}
  .pg-featured .pg-shot-main{object-fit:cover}
  .pg-shot::after{left:12px;bottom:11px;font-size:8px;letter-spacing:2px}
  .pg-open-next{position:absolute;right:12px;bottom:12px;margin:0;width:78px;height:78px}
  .pg-open-next svg{width:36px;height:36px}
  .pg-open-next span{bottom:-22px;font-size:8px}
  .pg-extra iframe{min-height:420px}
  .pg-slide.has-next .pg-fs-main{right:0;width:100%;bottom:180px;height:calc(100% - 180px)}
  .pg-slide.has-next::after{top:auto;left:0;right:0;bottom:150px;width:100%;height:120px;background:linear-gradient(to bottom,rgba(7,8,10,0),rgba(7,8,10,.92))}
  .pg-next-peek{top:auto;left:0;right:0;bottom:0;width:100%;height:180px;border-left:0;border-top:1px solid rgba(255,255,255,.08);grid-template-columns:1fr 1fr;grid-template-rows:1fr}
  .pg-next-copy{min-height:0;padding:18px 76px 18px 18px}
  .pg-next-copy h3{font-size:22px}
  .pg-next-copy p{font-size:8px}
  .pg-next-arrows{right:14px;bottom:18px;gap:7px}
  .pg-next-arrows .pg-fs-arrow{width:44px;height:44px}
  .pg-top{right:18px}
  .pg-bottom{left:18px;right:18px;bottom:22px}
  .pg-project-gradient{width:100%;height:44%;padding:26px 18px;background:linear-gradient(to bottom,rgba(7,8,10,.88),rgba(7,8,10,.56) 64%,rgba(7,8,10,0))}
  .pg-project-gradient h3{font-size:26px;margin-bottom:20px}
  .pg-info-row{margin-bottom:12px}
  .pg-close{width:44px;height:44px}
  .pg-caption,.pg-count{font-size:8px}
  .pg-fs-arrow{width:52px;height:52px}
}
@media(max-width:600px){
  .portfolio-gallery{padding:0 20px 40px}
  .pg-spec{display:block;margin-bottom:22px}
  .pg-spec h2{margin-bottom:22px}
  .pg-row{display:grid;grid-template-columns:96px 1fr;gap:16px;width:100%;padding:0 0 12px}
}
