.skn-routine{display:grid;gap:var(--skn-gap);overflow:visible;border-radius:0}.skn-routine__media{aspect-ratio:1 / 1;color:#fff}.skn-routine__image{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transform:scale(1.06);transition:opacity .9s var(--skn-ease),transform 1.4s var(--skn-ease)}.skn-routine__image.is-active{opacity:1;transform:none}.skn-routine__image img,.skn-routine__image svg{width:100%;height:100%;object-fit:cover;display:block}.skn-routine__image svg{fill:#3939392e}.skn-routine__media:after{content:"";position:absolute;top:40%;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.45),transparent);pointer-events:none}.skn-routine__title{position:absolute;z-index:2;left:var(--skn-pad);right:var(--skn-pad);bottom:var(--skn-pad);max-width:52rem}.skn-routine__panel{border-radius:var(--skn-radius);background:rgb(var(--color-background));color:rgb(var(--color-foreground));min-width:0;display:flex;flex-direction:column}.skn-routine__slider{display:flex;flex-direction:column;flex:1;min-width:0}.skn-routine__slider>.skn-slider__track{flex:1}.skn-routine__slide{display:flex;flex-direction:column;padding:var(--skn-pad);scroll-snap-stop:always}.skn-routine__step{display:flex;align-items:baseline;gap:.8rem;font-family:var(--font-heading-family);font-weight:700;text-transform:uppercase;font-size:1.3rem}.skn-routine__count{font-size:2rem;color:var(--skn-mauve)}.skn-routine__total{margin-left:auto;opacity:.5}.skn-routine__product{display:grid;place-items:center;flex:1;min-height:26rem;padding:2.4rem 0}.skn-routine__product img,.skn-routine__product svg{width:auto;max-width:70%;height:auto;max-height:38rem;object-fit:contain;border-radius:var(--skn-radius);transition:transform 1.2s var(--skn-ease)}@media(hover:hover){.skn-routine__slide:hover .skn-routine__product img{transform:scale(1.05) rotate(-2deg)}}.skn-routine__info{display:grid;gap:1.2rem;max-width:48rem}.skn-routine__info h3 a{color:inherit;text-decoration:none}.skn-routine__cta{margin-top:1.2rem}.skn-routine__controls{margin:0 var(--skn-pad) var(--skn-pad)}.skn-routine .skn-routine__arrows{display:flex}@media screen and (min-width:750px){.skn-routine{grid-template-columns:1fr 1fr}.skn-routine__media{aspect-ratio:auto;min-height:min(92vh,84rem)}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/skn-routine.css.map */