.hair-routine-row{--card-radius-ratio: .435;--card-width: clamp(11rem, 38vw, 17.9375rem);--card-radius: calc(var(--card-width) * var(--card-radius-ratio));--card-border: clamp(.25rem, .8vw, .375rem);--overlay-min-height: clamp(5.5rem, 34%, 10.5rem);--overlay-padding-block: clamp(.5rem, 1.6vw, .75rem);--overlay-padding-inline: clamp(.5rem, 2vw, 1rem);--track-gap: clamp(.5rem, 1.8vw, .75rem);--heading-gap: clamp(.75rem, 3vw, 2.5rem);--container-gutter: clamp(.75rem, 4vw, 2rem);--card-shadow: 0 20px 30px -20px rgba(var(--color-foreground), .25);--card-shadow-hover: 0 24px 40px -24px rgba(var(--color-foreground), .32)}.hair-routine-row__inner{display:flex;flex-direction:column;gap:var(--heading-gap);padding-inline:var(--container-gutter)}.hair-routine-row__heading-wrapper{display:flex;flex-direction:column;gap:clamp(.5rem,2vw,1rem);text-align:left}.hair-routine-row__heading-wrapper--center{text-align:center;align-items:center}.hair-routine-row__item{display:flex;justify-content:center}.hair-routine-row__card{position:relative;display:flex;flex-direction:column;align-items:stretch;width:var(--card-width);aspect-ratio:287 / 594;border-radius:var(--card-radius);overflow:visible;background-color:var(--background-color, #fff);box-shadow:var(--card-shadow);transition:transform .15s ease,box-shadow .15s ease;z-index:1;text-decoration:none;color:inherit}.hair-routine-row__card:hover,.hair-routine-row__card:focus-visible{transform:translateY(-4px);box-shadow:var(--card-shadow-hover)}.hair-routine-row__card:focus-visible{outline:2px solid rgba(var(--color-foreground),.4);outline-offset:4px}.hair-routine-row__card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:var(--card-border) solid var(--border-color, #000);border-radius:inherit;pointer-events:none;z-index:2}.hair-routine-row__media{position:relative;flex:1 1 auto;width:100%;border-radius:calc(var(--card-radius) - var(--card-border));overflow:hidden;mask-image:radial-gradient(circle at center,#fff 99%,transparent 100%);-webkit-mask-image:radial-gradient(circle at center,#fff 99%,transparent 100%);z-index:1}.hair-routine-row__image,.hair-routine-row__media .hero__img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}.hair-routine-row__overlay{position:absolute;left:0;right:0;bottom:0;min-height:var(--overlay-min-height);background-color:var(--vector-base-color, #5865c7);border:var(--card-border) solid var(--border-color, #000);border-top:0;border-radius:0;display:flex;align-items:center;justify-content:center;padding:var(--overlay-padding-block) var(--overlay-padding-inline);box-sizing:border-box;pointer-events:none;z-index:3}.hair-routine-row__overlay-text{display:flex;flex-direction:column;gap:clamp(.25rem,1vw,.5rem);align-items:center;text-align:center;width:100%;padding:clamp(.75rem,2vw,1.25rem);box-sizing:border-box;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto}.hair-routine-row__title{margin:0;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--title-color, currentColor);font-size:clamp(1.1rem,4vw,1.75rem)}.hair-routine-row__caption{margin:0;font-size:clamp(.75rem,3vw,1rem);line-height:1.3;color:var(--caption-color, currentColor)}.hair-routine-row__cta{margin-top:clamp(.35rem,1.5vw,.75rem);font-weight:600;text-decoration:underline;text-underline-offset:.25rem;text-align:center;color:var(--cta-color, currentColor);transition:opacity .12s ease;font-size:clamp(.7rem,2.5vw,.95rem)}a.hair-routine-row__card .hair-routine-row__cta{pointer-events:auto}a.hair-routine-row__card:hover .hair-routine-row__cta,a.hair-routine-row__card:focus-visible .hair-routine-row__cta{opacity:.88}.hair-routine-row__grid{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--card-width),1fr));gap:var(--track-gap);margin:0 auto;padding:0;max-width:1200px;justify-items:center;box-sizing:border-box}.hair-swiper{position:relative;width:100%;max-width:min(100%,1200px);margin:0 auto clamp(2.5rem,8vw,3.75rem);padding-inline:var(--container-gutter);box-sizing:border-box;overflow:hidden}.hair-swiper .swiper-wrapper{display:flex;gap:var(--track-gap);align-items:stretch;width:max-content}.hair-swiper .swiper-slide{display:flex;justify-content:center;flex:0 0 auto;width:var(--card-width)}.hair-swiper:not(.swiper-initialized){overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}.hair-swiper:not(.swiper-initialized) .swiper-slide{scroll-snap-align:center}.hair-swiper.swiper-initialized .swiper-wrapper{width:100%}@media (min-width: 750px){.hair-routine-row{--card-width: clamp(15rem, 16vw + 3rem, 17.9375rem);--card-radius: 7.8125rem;--card-border: .375rem;--overlay-min-height: clamp(9rem, 9vw, 11rem);--track-gap: clamp(.75rem, 1vw, 1rem);--container-gutter: 0}.hair-routine-row__inner{align-items:center;max-width:1200px;margin:0 auto}.hair-routine-row__heading-wrapper--center{width:100%;max-width:1200px;margin:0 auto}.hair-swiper{padding-inline:0}.hair-swiper .swiper-wrapper{display:grid;grid-auto-flow:column;justify-content:center;gap:var(--track-gap);width:100%}.hair-swiper:not(.swiper-initialized){overflow:visible}}@media (max-width: 480px){.hair-routine-row{--card-width: clamp(9.5rem, 42vw, 11.5rem);--card-radius: 6rem;--card-border: .25rem;--overlay-min-height: clamp(4.5rem, 36%, 6.5rem)}.hair-routine-row__inner{padding-inline:clamp(.75rem,6vw,1.25rem)}}@media (max-width: 360px){.hair-routine-row{--card-radius: 6.5rem}}@supports (clip-path: inset(0 round 1px)){.hair-routine-row__media{mask-image:none;-webkit-mask-image:none}}
/*# sourceMappingURL=/cdn/shop/t/68/assets/section-hair-routine-row.css.map */