.lo-hsl{position:relative;overflow:hidden;background:var(--lo-hsl-background)}.lo-hsl .lo-hsl-track{position:relative;width:100%;aspect-ratio:3 / 1;touch-action:pan-y pinch-zoom}@media(max-width:767px){.lo-hsl .lo-hsl-track{aspect-ratio:4 / 5}}.lo-hsl .lo-hsl-slide{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity .6s ease;z-index:0}@media(prefers-reduced-motion:reduce){.lo-hsl .lo-hsl-slide{transition:none}}.lo-hsl .lo-hsl-slide.active{opacity:1;z-index:1}.lo-hsl .lo-hsl-slide a,.lo-hsl .lo-hsl-slide .lo-hsl-noclick{display:block;width:100%;height:100%}.lo-hsl .lo-hsl-slide a,.lo-hsl .lo-hsl-slide img{-webkit-user-drag:none;-webkit-touch-callout:none}.lo-hsl .lo-hsl-pic{display:block;width:100%;height:100%}.lo-hsl .lo-hsl-img{width:100%;height:100%;object-fit:cover;object-position:center}.lo-hsl .lo-hsl-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem;background:linear-gradient(135deg,#0e1f47,#1e3a8a);color:#ffffff8c}.lo-hsl .lo-hsl-placeholder span{font-family:bebas-neue,sans-serif;font-size:clamp(1.5rem,4vw,3rem);letter-spacing:.05em;color:#fff6}.lo-hsl .lo-hsl-dots{position:absolute;bottom:24px;left:50%;transform:translate(-50%);display:flex;gap:10px;z-index:5}.lo-hsl .lo-hsl-dot{width:36px;height:3px;background:#fff6;border:none;cursor:pointer;padding:0;transition:background .2s,width .2s}.lo-hsl .lo-hsl-dot.active{background:#fff;width:52px}.lo-hsl .lo-hsl-dot:hover{background:#ffffffb3}@media(max-width:767px){.lo-hsl .lo-hsl-dots{bottom:16px;gap:8px}.lo-hsl .lo-hsl-dot{width:24px;height:3px}.lo-hsl .lo-hsl-dot.active{width:36px}}.lo-hsl .lo-hsl-arrow{position:absolute;top:50%;transform:translateY(-50%);background:#00000059;border:none;width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:#fff;cursor:pointer;z-index:5;transition:background .2s;padding:0}.lo-hsl .lo-hsl-arrow:hover{background:#0009}.lo-hsl .lo-hsl-arrow:focus-visible{outline:2px solid #ffffff;outline-offset:2px}.lo-hsl .lo-hsl-arrow.prev{left:16px}.lo-hsl .lo-hsl-arrow.next{right:16px}@media(max-width:767px){.lo-hsl .lo-hsl-arrow{width:36px;height:36px}.lo-hsl .lo-hsl-arrow.prev{left:8px}.lo-hsl .lo-hsl-arrow.next{right:8px}}
/*# sourceMappingURL=/cdn/shop/t/63/assets/hero-slider.css.map */