.photo-stage{position:relative;isolation:isolate;perspective:1400px;--photo-rx:0deg;--photo-ry:0deg}
.photo-float{display:block;position:relative;transform:rotateX(var(--photo-rx)) rotateY(var(--photo-ry)) rotateZ(var(--photo-angle,-4deg));transform-origin:center;backface-visibility:hidden;border:6px solid var(--photo-rim,#faf8ef);border-radius:22px;box-shadow:0 2px 1px #11221d20,0 12px 22px -8px #11221d40,0 42px 55px -25px #11221d70;transition:transform .6s cubic-bezier(.2,.7,.1,1),box-shadow .5s;overflow:hidden;background:var(--photo-rim,#faf8ef)}
.photo-float img{display:block;width:100%;height:100%;object-fit:cover}
a.photo-float:hover,button.photo-float:hover,.photo-float:focus-visible{transform:translateY(-9px) rotateX(var(--photo-rx)) rotateY(var(--photo-ry)) rotateZ(0deg);box-shadow:0 3px 1px #11221d20,0 20px 28px -10px #11221d40,0 54px 65px -24px #11221d80}
.photo-float:focus-visible{outline:3px solid #9b7936;outline-offset:7px}
.float-caption{position:absolute;inset:auto 0 0;padding:60px 22px 22px;display:block;color:#fff;background:linear-gradient(transparent,#081813e8);font:400 2rem/1.05 var(--serif);text-shadow:0 1px 8px #0005}
.float-caption>span{float:right;font-family:var(--sans);font-size:1.4rem;margin-top:6px}
.float-caption small{display:block;font:400 .57rem/1.5 var(--sans);letter-spacing:.09em;margin-bottom:8px}
@media(hover:none){.photo-stage{--photo-rx:0deg!important;--photo-ry:0deg!important}a.photo-float:hover,button.photo-float:hover{transform:rotate(var(--photo-angle,-4deg))}}
@media(prefers-reduced-motion:reduce){.photo-float{transition:none;transform:rotate(var(--photo-angle,-4deg))}a.photo-float:hover,button.photo-float:hover,.photo-float:focus-visible{transform:rotate(var(--photo-angle,-4deg))}}