.mcc-hero{--mcc-hero-pad-block: clamp(20px, 3vw, 40px);--mcc-hero-pad-inline: clamp(24px, 6vw, 96px);position:relative;width:100%;min-height:clamp(440px,58vh,620px);overflow:hidden;isolation:isolate;font-family:var(--brand-font-body);background:var(--brand-ocean-blue)}.mcc-hero__slide{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;visibility:hidden;transition:opacity .8s ease-in-out,visibility 0s linear .8s;display:flex;align-items:center;justify-content:center;gap:clamp(16px,2.5vw,28px);padding:var(--mcc-hero-pad-block) var(--mcc-hero-pad-inline);background:var(--mcc-hero-ground)}.mcc-hero__slide:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:color-mix(in srgb,var(--mcc-hero-ground) 52%,#fff);opacity:.55;-webkit-mask:url(mcc-hero-pattern.svg) left center / auto 175% no-repeat;mask:url(mcc-hero-pattern.svg) left center / auto 175% no-repeat}.mcc-hero__slide.is-active{opacity:1;visibility:visible;transition:opacity .8s ease-in-out}.mcc-hero__slide--ocean-blue{--mcc-hero-ground: var(--brand-ocean-blue)}.mcc-hero__slide--green{--mcc-hero-ground: var(--brand-green)}.mcc-hero__slide--spring-yellow{--mcc-hero-ground: var(--brand-spring-yellow)}.mcc-hero__slide--aquamarine{--mcc-hero-ground: var(--brand-aquamarine)}.mcc-hero__slide--lavender{--mcc-hero-ground: var(--brand-lavender)}.mcc-hero__slide--peach{--mcc-hero-ground: var(--brand-peach)}.mcc-hero__slide--coral{--mcc-hero-ground: var(--brand-coral)}.mcc-hero__content{position:relative;z-index:3;flex:0 1 48%;max-width:42rem;min-width:clamp(16rem,30vw,22rem);display:flex;flex-direction:column;justify-content:center;padding:clamp(26px,3.2vw,48px);color:#fff;background:color-mix(in srgb,color-mix(in srgb,var(--mcc-hero-ground) 38%,#000) 50%,transparent);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border-top-right-radius:clamp(72px,11vh,140px)}.mcc-hero__eyebrow{font-family:var(--brand-font-body);text-transform:uppercase;letter-spacing:.2em;font-size:.74rem;font-weight:700;margin-bottom:.9rem;opacity:.92}.mcc-hero__heading{font-family:var(--brand-font-heading);font-size:clamp(1.55rem,3.1vw,2.8rem);line-height:1.08;letter-spacing:-.01em;margin:0 0 1.4rem;font-weight:700;color:#fff}.mcc-hero__cta{font-family:var(--brand-font-body);display:inline-block;align-self:flex-start;padding:.8rem 1.8rem;background:var(--brand-black);color:var(--brand-cool-gray);border-radius:var(--brand-block-radius);text-decoration:none;font-weight:700;text-transform:uppercase;letter-spacing:.09em;font-size:1.1rem;transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease}.mcc-hero__cta:hover{background:var(--brand-spring-yellow);border-color:var(--brand-spring-yellow);color:var(--brand-black);transform:translateY(-1px)}.mcc-hero__cta:focus-visible{outline:3px solid var(--brand-spring-yellow);outline-offset:3px}.mcc-hero__product{flex:0 1 auto;max-width:60rem;max-height:100%;min-height:clamp(200px,32vh,320px);width:auto;object-fit:contain;object-position:center center;filter:drop-shadow(0 20px 34px rgba(0,0,0,.24));z-index:2}.mcc-hero__dots{position:absolute;bottom:1.25rem;left:50%;transform:translate(-50%);display:flex;gap:.4rem;z-index:4}.mcc-hero__dot{width:24px;height:24px;padding:0;border:none;border-radius:50%;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center}.mcc-hero__dot:after{content:"";width:10px;height:10px;border-radius:50%;background:#ffffff80;transition:background .2s ease,transform .2s ease}.mcc-hero__dot:hover:after{background:#fffc}.mcc-hero__dot.is-active:after{background:#fff;transform:scale(1.15)}.mcc-hero__dot:focus-visible{outline:2px solid #fff;outline-offset:2px}@media(prefers-reduced-motion:reduce){.mcc-hero__slide,.mcc-hero__cta,.mcc-hero__dot:after{transition:none}}@media screen and (max-width:900px){.mcc-hero__slide{flex-direction:column;justify-content:center;text-align:left;gap:clamp(12px,3vw,20px)}.mcc-hero__content{flex:0 1 auto;min-width:0;max-width:100%;border-top-right-radius:clamp(40px,14vw,88px)}.mcc-hero__product{flex:0 1 auto;max-width:78%;max-height:42%;min-height:clamp(160px,26vh,240px);width:auto;order:-1}.mcc-hero__motif{display:none}}
/*# sourceMappingURL=/cdn/shop/t/7/assets/section-mcc-hero.css.map */