.image-frame{flex-shrink:0;width:100%;min-width:0;position:relative}.image-frame-inner{border:1px solid #2ec4b62e;border-radius:16px;transition:border-color .35s,box-shadow .35s;position:relative;overflow:hidden;box-shadow:0 0 0 1px #2ec4b60f,0 0 50px #2ec4b612,0 25px 50px #00000073}.image-frame-inner img{width:100%;height:var(--frame-height,380px);object-fit:cover;transition:transform .5s;display:block}.image-frame-inner:hover img{transform:scale(1.03)}.image-frame-inner:hover{border-color:#2ec4b661;box-shadow:0 0 0 1px #2ec4b624,0 0 60px #2ec4b624,0 25px 50px #00000073}.image-frame-glow{pointer-events:none;background:linear-gradient(#0000 0%,#0d1f2d1a 60%,#0d1f2db3 100%);position:absolute;inset:0}.image-frame-inner:before,.image-frame-inner:after{content:"";z-index:2;pointer-events:none;opacity:0;width:0;height:0;position:absolute}.image-frame-inner:before{border-top:2px solid var(--signal-teal);border-left:2px solid var(--signal-teal);border-top-left-radius:14px;top:0;left:0}.image-frame-inner:after{border-bottom:2px solid var(--signal-teal);border-right:2px solid var(--signal-teal);border-bottom-right-radius:14px;bottom:0;right:0}@keyframes bracketTopLeft{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes bracketBottomRight{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}.is-visible .image-frame-inner:before{animation:.4s cubic-bezier(.16,1,.3,1) .35s both bracketTopLeft}.is-visible .image-frame-inner:after{animation:.4s cubic-bezier(.16,1,.3,1) .55s both bracketBottomRight}.image-frame-caption{color:#e8edf2d9;margin:0;font-size:.78rem;font-style:italic;position:absolute;bottom:.875rem;left:1rem;right:1rem}.image-frame-scan{z-index:3;pointer-events:none;border-radius:16px;position:absolute;inset:0;overflow:hidden}.image-frame-scan:after{content:"";background:linear-gradient(90deg,#0000 0%,#2ec4b68c 30%,#2ec4b6e6 50%,#2ec4b68c 70%,#0000 100%);height:3px;position:absolute;top:0;left:0;right:0;transform:translateY(-100%);box-shadow:0 0 14px #2ec4b68c}@keyframes scanSweep{0%{opacity:1;transform:translateY(-10px)}80%{opacity:.8}to{transform:translateY(calc(var(--frame-height,380px) + 10px));opacity:0}}.image-frame-inner:hover .image-frame-scan:after{animation:1.1s ease-in-out forwards scanSweep}.image-frame-autoscan{z-index:3;pointer-events:none;border-radius:16px;position:absolute;inset:0;overflow:hidden}.image-frame-autoscan:after{content:"";opacity:0;background:linear-gradient(90deg,#0000 0%,#2ec4b659 30%,#2ec4b6a6 50%,#2ec4b659 70%,#0000 100%);height:2px;position:absolute;top:0;left:0;right:0;transform:translateY(-10px);box-shadow:0 0 10px #2ec4b659}@keyframes autoScan{0%{opacity:0;transform:translateY(-10px)}2%{opacity:1}13%{opacity:.7}14%{transform:translateY(calc(var(--frame-height,380px) + 10px));opacity:0}14.01%{opacity:0;transform:translateY(-10px)}to{opacity:0;transform:translateY(-10px)}}.is-visible .image-frame-autoscan:after{animation:autoScan 8s ease-in-out var(--scan-delay,1.5s) infinite}.image-frame-inner:hover .image-frame-autoscan:after{opacity:0;animation-play-state:paused}@keyframes frameSlideFromRight{0%{opacity:0;transform:translate(52px)}to{opacity:1;transform:translate(0)}}@keyframes frameSlideFromLeft{0%{opacity:0;transform:translate(-52px)}to{opacity:1;transform:translate(0)}}@keyframes frameFadeFromTop{0%{opacity:0;transform:translateY(-32px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes frameScaleFadeIn{0%{opacity:0;transform:scale(.93)}to{opacity:1;transform:scale(1)}}.image-frame--slide-right.is-visible .image-frame-inner{animation:.85s cubic-bezier(.16,1,.3,1) both frameSlideFromRight}.image-frame--slide-left.is-visible .image-frame-inner{animation:.85s cubic-bezier(.16,1,.3,1) both frameSlideFromLeft}.image-frame--fade-top.is-visible .image-frame-inner{animation:.85s cubic-bezier(.16,1,.3,1) both frameFadeFromTop}.image-frame--scale-in.is-visible .image-frame-inner{animation:.75s cubic-bezier(.16,1,.3,1) both frameScaleFadeIn}@keyframes imageFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}.image-frame--float.is-visible{animation:7s ease-in-out 1.2s infinite imageFloat}@media (prefers-reduced-motion:reduce){.is-visible .image-frame-inner:before,.is-visible .image-frame-inner:after{opacity:1;width:36px;height:36px;animation:none}.image-frame--slide-right.is-visible .image-frame-inner,.image-frame--slide-left.is-visible .image-frame-inner,.image-frame--fade-top.is-visible .image-frame-inner,.image-frame--scale-in.is-visible .image-frame-inner{opacity:1;animation:none;transform:none}.image-frame--float.is-visible,.is-visible .image-frame-autoscan:after,.image-frame-inner:hover .image-frame-scan:after{animation:none}}
