.ph{--ph-red: var(--pl-red, #c8102e);--ph-ease: cubic-bezier(.22, .61, .36, 1);position:relative;display:block;overflow:hidden;background:#0b0b0c;isolation:isolate}.ph__stage{display:grid;aspect-ratio:var(--ph-ratio, 2.956);touch-action:pan-y}.ph__slide{grid-area:1 / 1;position:relative;min-width:0;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .9s var(--ph-ease),visibility 0s linear .9s}.ph__slide.is-active,.ph__slide.is-leaving{visibility:visible;transition:opacity .9s var(--ph-ease),visibility 0s}.ph__slide.is-active{z-index:2;opacity:1}.ph__slide.is-leaving{z-index:1;opacity:1}.ph__link,.ph__slide picture,.ph__image{display:block;width:100%;height:100%}.ph__image{object-fit:cover}.ph__placeholder{background:#1a1a1c;fill:#ffffff24}@media(prefers-reduced-motion:no-preference){.ph__slide.is-active .ph__image{animation:ph-settle calc(var(--ph-interval, 6s) + 2s) cubic-bezier(.25,.1,.25,1) both}}@keyframes ph-settle{0%{transform:scale(1.035)}to{transform:scale(1)}}.ph__dots{position:absolute;z-index:3;left:50%;bottom:clamp(10px,2.2vw,26px);display:flex;gap:4px;transform:translate(-50%)}.ph__dot{display:block;padding:12px 4px;margin:0;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}.ph__dot-line{position:relative;display:block;width:28px;height:3px;overflow:hidden;border-radius:3px;background:#ffffff80;box-shadow:0 0 0 .5px #0000002e,0 1px 4px #00000059;transition:width .45s var(--ph-ease),background-color .3s}.ph__dot:hover .ph__dot-line{background:#fffc}.ph__dot.is-active .ph__dot-line{width:56px;background:#ffffff8c}.ph__dot-line i{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:var(--ph-red);transform:scaleX(0);transform-origin:left center}.ph__dot.is-active .ph__dot-line i{transform:scaleX(1)}.ph.is-autoplay .ph__dot.is-active .ph__dot-line i{transform:scaleX(0);animation:ph-fill var(--ph-interval, 6s) linear forwards}.ph.is-autoplay:hover .ph__dot-line i,.ph.is-autoplay:focus-within .ph__dot-line i{animation-play-state:paused}@keyframes ph-fill{to{transform:scaleX(1)}}.ph__dot:focus-visible{outline:2px solid #fff;outline-offset:-4px;border-radius:6px}@media(max-width:767px){.ph__stage{aspect-ratio:var(--ph-ratio-m, var(--ph-ratio, 2.956))}.ph__dots{bottom:8px}.ph__dot-line{width:22px}.ph__dot.is-active .ph__dot-line{width:44px}}
/*# sourceMappingURL=/cdn/shop/t/22/assets/pedlock-hero.css.map */