.hero-carousel-container.page-width{max-width:1600px;margin-inline:auto;padding-inline:16px}@media(min-width:768px){.hero-carousel-container.page-width{padding-inline:64px}}hero-carousel{display:block;width:100%;position:relative;overflow:hidden}.media-banner{background-color:rgb(var(--_color-primary, var(--color-primary)));position:relative;overflow:hidden;color:#fff}.hero-carousel-container.page-width .media-banner{border-radius:8px}.media-banner_media{width:100%;max-height:min(calc(100svh - 188px),140rem)}.media-banner--small .media-banner_media{max-height:min(calc(100svh - 188px),120rem)}@media screen and (max-width:768px){max-height: 500px}@media screen and (min-width:1024px){.media-banner--small .media-banner_media{aspect-ratio:12/5}.media-banner--normal .media-banner_media{aspect-ratio:2/1;aspect-ratio:unset;height:100dvh;min-height:550px;max-height:550px}}@media screen and (min-width:1200px){.media-banner--normal .media-banner_media{aspect-ratio:unset;height:100dvh;min-height:600px;max-height:600px}}@media screen and (min-width:1400px){.media-banner--normal .media-banner_media{aspect-ratio:unset;height:100dvh;min-height:650px;max-height:650px}}@media screen and (min-width:1600px){.media-banner--normal .media-banner_media{aspect-ratio:unset;height:100dvh;min-height:700px;max-height:700px}}@media screen and (min-width:1800px){.media-banner--normal .media-banner_media{aspect-ratio:unset;height:100dvh;min-height:750px;max-height:750px}}@media screen and (min-width:2200px){.media-banner--normal .media-banner_media{aspect-ratio:unset;height:100dvh;min-height:850px;max-height:850px}}@media screen and (min-width:2400px){.media-banner--normal .media-banner_media{aspect-ratio:unset;height:100dvh;min-height:950px;max-height:950px}}.media-banner_media img,.media-banner_media video,.media-banner_media>svg{width:100%;height:100%;object-fit:cover}.media-banner_media img+img,.media-banner_media video+video{display:none}.media-banner_content{position:absolute;top:0;left:0;right:0;bottom:0;height:100%;padding:1rem;color:var(--text-color);display:flex;background:rgba(0,0,0,var(--overlay-desktop));z-index:1}@media(min-width:768px){.media-banner_content{padding:0 4rem}}.media-banner_content-inner{width:fit-content}.mb-subtitle{position:relative;margin-right:.4rem;display:inline-flex;align-items:center;gap:.4rem;width:fit-content}.mb-cta{margin-top:1.4rem}.mb-cta[is=custom-button]{cursor:not-allowed;--_color-primary: var(--color-light-grey);--button-primary-bg: var(--color-light-grey);--button-secondary-bg: var(--color-light-grey);--button-border-color: var(--color-light-grey);--button-primary-color: var(--color-white);--button-secondary-color: var(--color-black);color:rgba(var(--button-secondary-color),.5)}.mb-content{max-width:56rem;margin-top:1rem}.hp-banner_hair-quiz.design-mode:hover:after{opacity:1;visibility:visible}@media screen and (max-width:1023px){.media-banner_media{aspect-ratio:16/10}}@media screen and (max-width:768px){.media-banner_media>svg{width:auto;height:100%;object-fit:cover}.media-banner_media img:has(+img),.media-banner_media video:has(+video){display:none}.media-banner_media img+img,.media-banner_media video+video{display:block}.media-banner_media{height:calc(100svh - 188px);max-height:1000px;aspect-ratio:unset}.media-bannerM--small .media-banner_media{max-height:600px}.design-mode .media-banner_media{max-height:70rem}.media-banner_content{padding:1rem;background:rgba(0,0,0,var(--overlay-mobile))}.has-video .mb-content:not(:has(+.mb-cta)){max-width:min(calc(100% - 8rem),56rem)}.has-video .mb-title:not(:has(+.mb-cta,+.mb-content)){margin-bottom:6rem}}@media screen and (min-width:769px){.media-banner_cp-top-left,.media-banner_cp-top-right{align-items:flex-start;justify-content:flex-start}.media-banner_cp-top-center{align-items:flex-start;justify-content:center;text-align:center}.media-banner:not(.has_button) .media-banner_cp-top-right{align-items:flex-start;justify-content:flex-end;text-align:right}.media-banner_cp-middle-left{align-items:center;justify-content:flex-start}.media-banner_cp-middle-center{align-items:center;justify-content:center;text-align:center}.media-banner_cp-middle-right{align-items:center;justify-content:flex-end;text-align:right}.media-banner_cp-bottom-left,.media-banner_cp-bottom-right{align-items:flex-end;justify-content:flex-start}.media-banner_cp-bottom-center{align-items:flex-end;justify-content:center;text-align:center}.media-banner:not(:has(.media-controls)) .media-banner_cp-bottom-right{align-items:flex-end;justify-content:flex-end;text-align:right}}@media screen and (max-width:768px){.media-banner_cpm-top-left{align-items:flex-start;justify-content:flex-start}.media-banner_cpm-top-center{align-items:flex-start;justify-content:center;text-align:center}.media-banner_cpm-top-right{align-items:flex-start;justify-content:flex-end;text-align:right}.media-banner_cpm-middle-left{align-items:center;justify-content:flex-start}.media-banner_cpm-middle-center{align-items:center;justify-content:center;text-align:center}.media-banner_cpm-middle-right{align-items:center;justify-content:flex-end;text-align:right}.media-banner_cpm-bottom-left{align-items:flex-end;justify-content:flex-start}.media-banner:not(:has(.media-controls)) .media-banner_cpm-bottom-center{align-items:flex-end;justify-content:center;text-align:center}.media-banner:not(:has(.media-controls)) .media-banner_cpm-bottom-right{align-items:flex-end;justify-content:flex-end;text-align:right}.media-banner_cpm-bottom-center,.media-banner_cpm-bottom-right{align-items:flex-end;justify-content:flex-start}}.media-controls{position:absolute;right:2rem;bottom:2.2rem;z-index:2;display:flex;gap:0}.media-controls button{background-color:transparent;border:none;cursor:pointer;width:4rem;height:4rem;display:flex;align-items:center;justify-content:center;color:#fff}.media-controls .icon-play,.media-controls .icon-pause{position:unset;inset:unset}.volume-toggle svg{width:1.4rem;height:auto}.media-toggle svg{width:1.1rem;height:auto}.media-toggle .icon-play{width:1rem}.media-toggle:not(.paused) .icon-play{display:none}.media-toggle.paused .icon-pause,.volume-toggle.unmuted .icon-volume-off{display:none}.volume-toggle:not(.unmuted) .icon-volume-on{display:none}@media screen and (max-width:768px){.media-controls{right:.9rem;bottom:2.3rem}.media-controls button{width:3rem;height:3rem}}.mb-subtitle{font-size:clamp(16px,.85vw,20px);font-weight:500;font-family:Inter;margin:unset;margin-bottom:.5rem;line-height:1;flex-wrap:wrap;max-width:300px}.mb-title{font-size:2.5rem;font-weight:500;line-height:1.1;margin:unset}.mb-title--small-title--true{font-size:32px;font-weight:700}.mb-content{font-size:16px;font-weight:400;line-height:1.4}.mb-cta.button--primary{background-color:#4670db;padding:16px;line-height:1;font-size:16px;text-decoration:none;color:#fff;border-radius:6px;margin:unset}.dual-buttons-wrapper{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap;margin-top:40px}.dual-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 35px;background-color:#4670db;line-height:1;border-radius:6px;font-size:14px;text-decoration:unset;font-weight:400;font-family:Inter;color:#fff;letter-spacing:0;min-width:208px;text-align:center}.hero-carousel-button-wrapper{margin-top:32px}@media(min-width:768px){.mb-subtitle{max-width:unset}.mb-title{font-size:4rem;font-weight:600;line-height:1.2}.mb-title--small-title--true{font-size:40px;font-weight:700;letter-spacing:0}.mb-content{font-size:clamp(16px,1vw,24px);font-weight:500;line-height:1.4}.mb-content--regular--true{font-weight:400}}
/*# sourceMappingURL=/cdn/shop/t/31/assets/media-banner.css.map */