.art-gallery{
  --art-rot:10deg;
  --art-radius:780px;
  width:92%;
  max-width:1440px;
  margin:var(--nxt-section-gap, 64px) auto 0;
  background:#F0EFE5;
  color:var(--nxt-heading,#40483f);
  font-family:var(--nxt-font,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif)
}
.art-gallery-sticky{
  position:relative;
  min-height:100svh
}
.art-gallery-left{
  display:flex;
  flex-direction:column;
  gap:var(--nxt-subsection-gap,48px);
  min-width:0;
  position:relative;
  z-index:2;
  background:#F0EFE5
}
.art-gallery-copy{
  position:relative;
  max-width:34rem
}
.art-gallery-copy h2{
  margin:0;
  color:var(--nxt-heading,#40483f);
  font:600 var(--nxt-title-size,32px)/1.25 var(--nxt-font,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif)
}
.art-gallery-copy p{
  margin:var(--nxt-copy-gap,24px) 0 0;
  color:var(--nxt-body,#465865);
  font:400 var(--nxt-body-size,16px)/var(--nxt-body-leading,28px) var(--nxt-font,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif)
}
.art-gallery-devices{
  position:relative;
  padding:0 10% 14% 0
}
.art-tablet,
.art-phone{margin:0}
.art-tablet{
  width:92%;
  filter:drop-shadow(0 28px 50px #0000002e)
}
.art-phone{
  position:absolute;
  right:0;
  bottom:0;
  width:26%;
  transform:rotate(4deg);
  filter:drop-shadow(0 24px 36px #00000033)
}
.art-tablet img,
.art-phone img{
  display:block;
  width:100%;
  height:auto
}
.art-gallery-stage{
  position:relative;
  min-width:0;
  min-height:min(62svh,560px)
}
.art-gallery-space{
  position:absolute;
  inset:0;
  perspective:1500px;
  perspective-origin:88% 48%
}
.art-gallery-world{
  position:absolute;
  inset:0;
  transform-style:preserve-3d;
  transform-origin:88% 50%;
  transform:scaleX(-1) translateZ(calc(-1 * var(--art-radius))) rotateY(var(--art-rot))
}
.art-gallery-ring{
  position:absolute;
  left:70%;
  top:50%;
  width:0;
  height:0;
  transform-style:preserve-3d
}
.art-gallery-card{
  position:absolute;
  left:0;
  top:0;
  width:clamp(128px,11vw,156px);
  margin:0;
  aspect-ratio:1080/2460;
  transform-origin:center center;
  backface-visibility:hidden;
  background:transparent
}
.art-gallery-card img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:16px;
  transform:scaleX(-1);
  box-shadow:0 18px 40px #00000024
}
@media(min-width:701px) and (prefers-reduced-motion:no-preference){
  .art-gallery{height:220svh}
  .art-gallery-sticky{
    position:sticky;
    top:0;
    height:100svh;
    min-height:0;
    box-sizing:border-box;
    padding:clamp(24px,5vh,56px) 0
  }
  .art-gallery-left{
    width:38%;
    height:100%;
    justify-content:flex-start;
    background:#F0EFE5
  }
  .art-gallery-stage{
    position:absolute;
    inset:0;
    height:auto;
    min-height:0
  }
}
@media(max-width:700px){
  .art-gallery{width:96%}
  .art-gallery-copy{padding:0}
  .art-gallery-stage{min-height:360px;margin-top:32px;overflow:clip}
  .art-gallery-space{perspective:1400px;perspective-origin:50% 50%}
  .art-gallery-world{transform-origin:50% 50%}
  .art-gallery-ring{left:50%;top:50%}
  .art-gallery-card{width:min(26vw,120px)}
  .art-gallery-card img{border-radius:14px}
}
@media(prefers-reduced-motion:reduce){
  .art-gallery{height:auto}
  .art-gallery-sticky{position:relative;height:auto}
}