.koji-hero-wrapper{background-color:var(--hero-bg);padding:var(--hero-padding-top-mobile) 12px var(--hero-padding-bottom-mobile) 12px;width:100%;display:flex;justify-content:center}.koji-hero-container{position:relative;width:100%;max-width:1600px;border-radius:20px;border:.75px solid var(--hero-border);overflow:hidden;background-color:#0003;box-shadow:0 15px 40px #0003;touch-action:pan-y pinch-zoom}.koji-hero-track{display:flex;width:100%;height:100%;transition:transform .6s cubic-bezier(.25,1,.5,1);will-change:transform}.koji-hero-slide{flex:0 0 100%;width:100%;position:relative}.koji-hero-link{display:block;width:100%;height:100%;text-decoration:none;-webkit-tap-highlight-color:transparent}.koji-hero-img{width:100%;height:auto;aspect-ratio:1 / 1;object-fit:cover;display:block}.koji-img-desktop{display:none}.koji-img-mobile{display:block}.koji-placeholder{background-color:#2a2a2a;color:#555}.koji-hero-dots{position:absolute;bottom:16px;left:50%;transform:translate(-50%);display:flex;gap:8px;z-index:10;padding:6px 12px;background:#0000004d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:20px;border:.75px solid rgba(255,255,255,.1)}.koji-hero-dot{width:8px;height:8px;border-radius:50%;background-color:#fff6;border:none;padding:0;cursor:pointer;transition:all .3s cubic-bezier(.25,1,.5,1)}.koji-hero-dot.is-active{background-color:#fff;width:24px;border-radius:4px}.koji-hero-arrow{display:none}@media screen and (min-width:990px){.koji-hero-wrapper{padding:var(--hero-padding-top) 24px var(--hero-padding-bottom) 24px;margin-top:110px}.koji-hero-container{border-radius:24px}.koji-img-mobile{display:none}.koji-img-desktop{display:block;aspect-ratio:2.4 / 1}.koji-hero-dots{bottom:24px;gap:10px}.koji-hero-arrow{display:flex;align-items:center;justify-content:center;position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;background:#0000004d;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:.75px solid rgba(255,255,255,.2);border-radius:50%;color:#fff;cursor:pointer;z-index:10;transition:all .3s cubic-bezier(.175,.885,.32,1.275);opacity:0}.koji-hero-container:hover .koji-hero-arrow{opacity:1}.koji-hero-prev{left:24px}.koji-hero-next{right:24px}.koji-hero-arrow:hover{background:#fff;color:#000;transform:translateY(-50%) scale(1.1)}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/koji-hero-slider.css.map */