/* Model pages: the Gallery's cinema viewer (1.36-85) */

:root{
  /* animation timings */
  --t-iris:1.5s; --t-close:1.2s; --t-settle:2.4s; --t-gleam:1.9s; --t-gleam-delay:.45s;
  --t-line:1.1s; --t-cap-delay:.7s; --t-shutter:.75s; --t-hover:1.6s; --t-pulse:1.5s; --t-reveal:1.2s;
  --gx-ease:cubic-bezier(.22,.8,.2,1);
  --gx-bg:#1B1D1F; --gx-panel:#24272A; --gx-tx:#ECE8DF; --gx-dim:#B9B5AB; --gx-brass:#C9963D;
  --gx-hair:rgba(201,150,61,.55);
}
body.gx-lock{overflow:hidden}
#gx-v{position:fixed;inset:0;z-index:9999;background:#111213;display:none;touch-action:none}
#gx-v.gx-on{display:block}
.gx-stage{position:absolute;inset:0;overflow:hidden;cursor:zoom-out}
#gx-vi{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:16vh 22vw 24vh;transform-origin:center 45%}
.gx-gleam{position:absolute;top:-20%;bottom:-20%;left:0;width:14%;pointer-events:none;opacity:0;transform:translateX(-200%) skewX(-24deg);
  background:linear-gradient(90deg,transparent,rgba(201,150,61,.16) 46%,rgba(236,232,223,.22) 50%,rgba(201,150,61,.16) 54%,transparent)}
.gx-cap{position:absolute;left:clamp(20px,5vw,88px);bottom:clamp(22px,4vw,44px);pointer-events:none;max-width:70%}
.gx-cap p{overflow:hidden;padding:.08em 0}
.gx-cap span{display:block;transform:translateY(115%);opacity:0;transition:transform var(--t-line) var(--gx-ease),opacity var(--t-line) var(--gx-ease);transition-delay:calc(var(--i)*.13s + var(--t-cap-delay))}
.gx-cap.gx-in span{transform:none;opacity:1}
.gx-cap.gx-out span{transition:opacity .5s ease;transition-delay:0s;opacity:0;transform:none}
.gx-c1{font:300 clamp(34px,5vw,60px)/1.05 'Cormorant Garamond',serif;font-style:italic}
.gx-c2{font:italic 300 clamp(18px,2vw,24px)/1.3 'Cormorant Garamond',serif;color:var(--gx-dim)}
.gx-c3,.gx-c4{font:400 11px/2 'Jost',sans-serif;letter-spacing:.15em;text-transform:uppercase;color:var(--gx-dim)}
.gx-c3 span::before{content:"";display:inline-block;width:22px;height:1px;background:var(--gx-brass);vertical-align:middle;margin-right:12px}
.gx-c4{color:var(--gx-tx)}
.gx-btn{position:absolute;z-index:5;width:52px;height:52px;border-radius:50%;background:rgba(27,29,31,.35);border:1px solid var(--gx-hair);color:var(--gx-tx);cursor:pointer;display:grid;place-items:center;opacity:0;transition:opacity 1s var(--gx-ease),background 1s var(--gx-ease)}
.gx-btn:hover{background:rgba(201,150,61,.1)}
.gx-btn:focus-visible{outline:1px solid var(--gx-tx);outline-offset:3px}
#gx-v.gx-ui .gx-btn{opacity:1;transition-delay:.9s}
#gx-v.gx-ui.gx-closing .gx-btn{opacity:0;transition:opacity .4s;transition-delay:0s}
.gx-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1}
#gx-x{top:20px;right:20px}#gx-pv,#gx-nx{top:50%;margin-top:-26px}#gx-pv{left:20px}#gx-nx{right:20px}
.gx-slats{position:absolute;inset:0;z-index:4;pointer-events:none;display:flex}
.gx-slats i{flex:1;background:var(--gx-bg);transform:translateY(-101%);border-right:1px solid rgba(201,150,61,.35)}
.gx-slats i:last-child{border:0}
@media(max-width:700px){
  #gx-vi{padding:100px 11vw 240px}
  .gx-cap{max-width:calc(100% - 40px);bottom:24px}
  .gx-btn{width:44px;height:44px}#gx-pv,#gx-nx{top:auto;bottom:24px;margin:0}#gx-pv{left:auto;right:76px}#gx-nx{right:20px}#gx-x{top:12px;right:12px}
}
@media(prefers-reduced-motion:reduce){.gx-cap span{transform:none;transition:opacity .4s;transition-delay:0s}}
#gx-v{font-family:'Jost',sans-serif;font-weight:300;color:var(--gx-tx)}#gx-v,#gx-v *{box-sizing:border-box}
.gx-zoomable{cursor:zoom-in}

.gx-zoomable{transition:transform var(--t-hover) var(--gx-ease)!important}
@media(hover:hover){.gx-zoomable:hover{transform:scale(1.07)}}
.gx-clip{overflow:hidden}
#gx-view{position:fixed;left:0;top:0;width:84px;height:84px;margin:-42px 0 0 -42px;border:1px solid var(--gx-hair);border-radius:50%;display:grid;place-items:center;
  background:rgba(27,29,31,.5);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:60;opacity:0;transform:scale(.6);
  transition:opacity 1s var(--gx-ease),transform 1s var(--gx-ease),left .6s var(--gx-ease),top .6s var(--gx-ease);pointer-events:none;
  font:400 10px 'Jost',sans-serif;letter-spacing:.15em;text-transform:uppercase;color:var(--gx-tx)}
#gx-view.gx-show{opacity:1;transform:none}
@media(hover:none){#gx-view{display:none}}