.slider{position:relative;z-index:0}.slider__items{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;height:300px!important}.slider__item{height:300px;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;border-radius:.75rem;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:1s;transition-timing-function:cubic-bezier(.19,1,.22,1);will-change:transform}img{pointer-events:none;height:100%;width:100%;touch-action:none;-o-object-fit:cover;object-fit:cover}.slider__nav{margin-top:.75rem;display:flex;justify-content:center;gap:.75rem}.slider__nav button{min-width:120px}.slider__dots{display:flex;justify-content:center;margin-top:10px}.slider__dots li{margin:0 5px}.slider__dots button{position:relative;z-index:1;border-radius:0;border-width:0px;--tw-bg-opacity: 1;background-color:rgb(255 230 0 / var(--tw-bg-opacity, 1));padding:.5rem 1rem}.slider__dots button:before{position:absolute;top:0;left:0;bottom:0;z-index:-1;display:block;width:0px;--tw-bg-opacity: 1;background-color:rgb(22 21 22 / var(--tw-bg-opacity, 1));transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s;--tw-content: "";content:var(--tw-content)}.slider__dots button:hover{--tw-bg-opacity: 1;background-color:rgb(255 230 0 / var(--tw-bg-opacity, 1));--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity, 1))}.slider__dots button:hover:before{content:var(--tw-content);width:100%}.slider__dots button:is(.dark *):before{content:var(--tw-content);--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.slider__dots button:hover:is(.dark *){--tw-text-opacity: 1;color:rgb(22 21 22 / var(--tw-text-opacity, 1))}.slider__active{background:#f3f4f6}.slider--demo-1{overflow:hidden}.slider--demo-1 .slider__item{position:absolute;width:100%}.slider--demo-1 .slider__item[data-pos="-2"]{--tw-translate-x: -200%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:0}.slider--demo-1 .slider__item[data-pos="-1"]{--tw-translate-x: -100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:0}.slider--demo-1 .slider__item[data-pos="0"]{z-index:1}.slider--demo-1 .slider__item[data-pos="1"]{--tw-translate-x: 100%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.slider--demo-1 .slider__item[data-pos="2"]{--tw-translate-x: 200%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.slider--demo-2{--slider--gap: 20px;--slider--per-view: 3;position:relative;z-index:0}.slider--demo-2 .slider__items{display:flex;gap:var(--slider--gap)}.slider--demo-2 .slider__item{width:auto;min-width:calc(100% / var(--slider--per-view) - var(--slider--gap) * .33 * (var(--slider--per-view) - 1))}.slider--demo-2[data-current="0"] .slider__item{transform:translateZ(0)}.slider--demo-2[data-current="1"] .slider__item{transform:translate3d(calc(-100% - var(--slider--gap)),0,0)}.slider--demo-2[data-current="2"] .slider__item{transform:translate3d(calc(-200% - var(--slider--gap) * 2),0,0)}.slider--demo-2[data-current="3"] .slider__item{transform:translate3d(calc(-300% - var(--slider--gap) * 3),0,0)}.slider--demo-2[data-current="4"] .slider__item{transform:translate3d(calc(-400% - var(--slider--gap) * 4),0,0)}.slider--demo-3{--slider--gap: 20px;--slider--per-view: 3;position:relative;z-index:0;overflow:hidden}.slider--demo-3 .slider__items{display:flex;-moz-column-gap:var(--slider--gap);column-gap:var(--slider--gap);transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:1s}.slider--demo-3 .slider__item{min-width:calc(100% / var(--slider--per-view) - var(--slider--gap) * .5 * (var(--slider--per-view) - 1))}.slider--demo-3[data-current="0"] .slider__items{transform:translate3d(calc((100% / var(--slider--per-view)) + var(--slider--gap) * .5),0,0)}.slider--demo-3[data-current="1"] .slider__items{transform:translate3d(calc(var(--slider--gap) * .5),0,0)}.slider--demo-3[data-current="2"] .slider__items{transform:translate3d(calc((-100% / var(--slider--per-view)) + var(--slider--gap) * .5),0,0)}.slider--demo-3[data-current="3"] .slider__items{transform:translate3d(calc((-200% / var(--slider--per-view)) + var(--slider--gap) * .5),0,0)}.slider--demo-3[data-current="4"] .slider__items{transform:translate3d(calc((-300% / var(--slider--per-view)) + var(--slider--gap) * .5),0,0)}.slider--demo-4 .slider__item{position:absolute;left:50%;margin-left:-100px;width:200px}.slider--demo-4 img{margin-left:-100px;width:400px;max-width:none;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.5s}.slider--demo-4 .slider__item[data-pos="-2"]{--tw-translate-x: -220%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:0}.slider--demo-4 .slider__item[data-pos="-2"] img{--tw-translate-x: 100px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.slider--demo-4 .slider__item[data-pos="-1"]{--tw-translate-x: -110%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.slider--demo-4 .slider__item[data-pos="-1"] img{--tw-translate-x: 50px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.slider--demo-4 .slider__item[data-pos="1"]{--tw-translate-x: 110%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.slider--demo-4 .slider__item[data-pos="1"] img{--tw-translate-x: -50px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.slider--demo-4 .slider__item[data-pos="2"]{--tw-translate-x: 220%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:0}.slider--demo-4 .slider__item[data-pos="2"] img{--tw-translate-x: -100px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}