/*!
 * image-compare — dependency-free before/after slider
 * https://github.com/sigtrygg-space/kirby-image-compare | MIT
 */.image-compare-stage{position:relative;overflow:hidden;aspect-ratio:var(--image-compare-ratio, 3 / 2);cursor:ew-resize;user-select:none;touch-action:none}.image-compare-before,.image-compare-after{position:absolute;inset:0}.image-compare-after{clip-path:inset(0 calc(100% - var(--image-compare-start, 50%)) 0 0)}.image-compare-before{clip-path:inset(0 0 0 var(--image-compare-start, 50%))}.image-compare-before :where(picture),.image-compare-after :where(picture),.image-compare-pic{display:block;width:100%;height:100%}.image-compare-before :where(img),.image-compare-after :where(img){width:100%;height:100%;object-fit:cover}.image-compare-handle{position:absolute;inset:0 auto 0 var(--image-compare-start, 50%);transform:translate(-50%);width:var(--image-compare-line-width, 2px);border:none;padding:0;background:var(--image-compare-line-color, #fff);cursor:ew-resize}.image-compare-handle:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--image-compare-handle-size, 2rem);height:var(--image-compare-handle-size, 2rem);border-radius:50%;background:var(--image-compare-handle-bg, #fff);box-shadow:0 1px 3px #0000004d}@property --_arrow-left{syntax: "<color>"; inherits: false; initial-value: transparent;}@property --_arrow-right{syntax: "<color>"; inherits: false; initial-value: transparent;}.image-compare-handle:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:var(--image-compare-handle-size, 2rem);height:var(--image-compare-handle-size, 2rem);--_arrow-left: var(--image-compare-handle-color, #555);--_arrow-right: var(--image-compare-handle-color, #555);background-image:linear-gradient(to right,var(--_arrow-left) 50%,var(--_arrow-right) 50%);mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 7l-5 5 5 5V7zm8 0v10l5-5-5-5z'/%3E%3C/svg%3E") center / var(--image-compare-arrow-size, 75%) no-repeat;transition:--_arrow-left .25s ease,--_arrow-right .25s ease}.image-compare-handle{--_hover-color: var(--image-compare-handle-hover-color, var(--image-compare-handle-color, #555))}@supports (color: AccentColor){.image-compare-handle{--_hover-color: var(--image-compare-handle-hover-color, AccentColor)}}@media (hover: hover){.image-compare-handle:hover:after{--_arrow-left: var(--_hover-color);--_arrow-right: var(--_hover-color)}}.image-compare-handle:focus-visible:after,.image-compare-handle[data-active]:after{--_arrow-left: var(--_hover-color);--_arrow-right: var(--_hover-color)}.image-compare-handle[data-direction=left]:after{--_arrow-right: var(--image-compare-handle-color, #555)}.image-compare-handle[data-direction=right]:after{--_arrow-left: var(--image-compare-handle-color, #555)}