.scent-quiz{--sq-ink: #1d082c;--sq-purple: #5a1d85;--sq-red: #e7060e;--sq-gradient: linear-gradient(110deg, #f5ecff 2.57%, #efd6ff 92.48%);--sq-ease: cubic-bezier(.23, 1, .32, 1);display:block;color:var(--sq-ink)}.scent-quiz__box{position:relative;overflow:hidden;overflow-anchor:none;background:var(--sq-gradient)}.scent-quiz__heading{margin:0;font-family:var(--font-heading-family);font-weight:800;font-size:2.4rem;line-height:1.1;text-transform:uppercase;text-wrap:balance;color:var(--sq-ink)}.scent-quiz__heading:focus{outline:none}.scent-quiz__text{margin:0;font-family:var(--font-body-family);font-size:1.4rem;line-height:1.6;letter-spacing:.01em;color:var(--sq-ink)}@media screen and (min-width:750px){.scent-quiz__heading{font-size:4rem;line-height:1.2;letter-spacing:-.04em}.scent-quiz__text{font-size:1.8rem;line-height:2.8rem}}.scent-quiz__btn{--color-button-text: #ffffff;--color-button-background: var(--sq-purple);--color-button-outline: var(--sq-purple);--color-button-hover-text: #ffffff;--color-button-hover-background: color-mix(in srgb, var(--sq-purple) 86%, #ffffff);--color-button-hover-outline: color-mix(in srgb, var(--sq-purple) 86%, #ffffff);display:inline-flex;align-items:center;justify-content:center;min-height:5.4rem;transition:color var(--duration-long),background-color var(--duration-long),border-color var(--duration-long),transform .16s var(--sq-ease)}.scent-quiz__btn:active{transform:scale(.97)}.scent-quiz__btn--outline{--color-button-text: var(--sq-purple);--color-button-background: #ffffff;--color-button-hover-text: #ffffff;--color-button-hover-background: var(--sq-purple);--color-button-hover-outline: var(--sq-purple)}.scent-quiz__btn--block{width:100%;min-height:5.6rem}.scent-quiz__btn:focus-visible{outline:.2rem solid var(--sq-purple);outline-offset:.3rem}@media screen and (min-width:750px){.scent-quiz__btn:not(.scent-quiz__btn--block){min-width:20.3rem}}.scent-quiz__intro{display:flex;flex-direction:column;align-items:center;gap:7.6rem;padding:7.3rem 2rem 0;text-align:center}.scent-quiz__intro-copy{display:flex;flex-direction:column;align-items:center}.scent-quiz__intro .scent-quiz__heading{max-width:15em}.scent-quiz__intro .scent-quiz__text{padding-block-end:1.6rem}.scent-quiz__bottles{display:block;width:min(112.1rem,100%);height:auto}@media screen and (max-width:749px){.scent-quiz__box{background:linear-gradient(97deg,#f5ecff 2.57%,#ffdcf5 92.48%)}}@media screen and (min-width:750px){.scent-quiz__intro .scent-quiz__text{max-width:56.2rem;padding-block-end:2.4rem}}.scent-quiz[data-open=inline] .scent-quiz__intro{display:none}.scent-quiz__dialog{position:static;width:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:inherit}.scent-quiz__panel{position:relative;padding:4.8rem 2.5rem}@media screen and (min-width:750px){.scent-quiz__panel{padding:7.3rem clamp(2.4rem,4.6vw,6.4rem) 8rem}}.scent-quiz__dialog:modal{position:fixed;top:0;right:0;bottom:0;left:0;margin:auto;width:min(37.6rem,calc(100% - 3.2rem));height:fit-content;max-height:calc(100dvh - 3.2rem);overflow-y:auto;overscroll-behavior:contain;background:linear-gradient(94deg,#f5ecff 2.57%,#efd6ff 92.48%);animation:sq-pop .34s var(--sq-ease)}html:has(.scent-quiz__dialog:modal){overflow:hidden}.scent-quiz__dialog::backdrop{background:#00000073;animation:sq-fade .24s ease-out}.scent-quiz__close{display:none}.scent-quiz__dialog:modal .scent-quiz__close{position:absolute;top:.4rem;right:.4rem;display:grid;place-items:center;width:4.4rem;height:4.4rem;padding:0;border:0;background:none;color:var(--sq-ink);cursor:pointer}.scent-quiz__step{display:flex;flex-direction:column;align-items:center;gap:3.5rem;text-align:center;animation:sq-fade .3s ease-out backwards}.scent-quiz__step[hidden],.scent-quiz__result[hidden]{display:none}.scent-quiz__body{display:flex;flex-direction:column;gap:3.2rem;width:100%}@media screen and (min-width:990px){.scent-quiz__step{display:grid;grid-template-columns:minmax(24rem,40.8rem) minmax(0,79.4rem);justify-content:space-between;align-items:start;column-gap:4rem;text-align:start}.scent-quiz__step--result{grid-template-columns:minmax(24rem,40.8rem) minmax(0,85.5rem)}}.scent-quiz__options{--sq-answer-aspect: 1.9;display:flex;flex-direction:column;gap:1.6rem}.scent-quiz__options:has(>:nth-child(3)){--sq-answer-aspect: 1.31}.scent-quiz__options.is-shaking{animation:sq-shake .36s ease-in-out}.scent-quiz__option{position:relative;display:flex;flex-direction:row-reverse;overflow:hidden;background:#fff;cursor:pointer;-webkit-tap-highlight-color:transparent;animation:sq-in .42s var(--sq-ease) backwards;animation-delay:calc(var(--i, 0) * 50ms + 60ms);transition:transform .16s var(--sq-ease)}.scent-quiz__option:active{transform:scale(.98)}.scent-quiz__option:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border:.2rem solid transparent;pointer-events:none;transition:border-color .2s ease-out}.scent-quiz__option:has(input:checked):after{border-color:var(--sq-purple)}.scent-quiz__option:has(input:focus-visible){outline:.2rem solid var(--sq-purple);outline-offset:.3rem}.scent-quiz__option-media{flex:none;height:7.8rem;aspect-ratio:var(--sq-answer-aspect);overflow:hidden;background:#f3e6f6}.scent-quiz__option-media img,.scent-quiz__option-media svg{display:block;width:100%;height:100%;object-fit:cover;transition:transform .5s var(--sq-ease)}.scent-quiz__option-label{flex:1 1 auto;display:flex;align-items:center;justify-content:center;min-height:7.8rem;padding:1.2rem 2.4rem;font-family:var(--font-button-family);font-weight:600;font-size:1.4rem;line-height:1.2;letter-spacing:.0625em;text-transform:uppercase;text-align:center;text-wrap:balance;color:#000;background:#fff;transition:background-color .2s ease-out,color .2s ease-out}.scent-quiz__option:has(input:checked) .scent-quiz__option-label{color:#fff;background:#000}@media(hover:hover){.scent-quiz__option:not(:has(input:checked)):hover .scent-quiz__option-label{background:var(--button-lilac)}.scent-quiz__option:hover .scent-quiz__option-media img{transform:scale(1.04)}}@media screen and (min-width:750px){.scent-quiz__options{flex-direction:row;gap:2.8rem}.scent-quiz__option{flex:1 1 0;min-width:0;flex-direction:column}.scent-quiz__option-media{width:100%;height:20.2rem;aspect-ratio:auto}.scent-quiz__option-label{font-size:1.6rem}}.scent-quiz__nav{display:flex;justify-content:space-between;gap:1.6rem}.scent-quiz__nav [data-quiz-next]{margin-inline-start:auto}@media screen and (max-width:749px){.scent-quiz__nav>:only-child{flex:1 1 auto}}.scent-quiz__result-copy{display:flex;flex-direction:column;gap:1.2rem}@media screen and (min-width:990px){.scent-quiz__result-copy{gap:1.6rem}}.scent-quiz__result{display:grid;grid-template-columns:13rem minmax(0,1fr);grid-template-areas:"media head" "insp insp" "actions actions";align-items:center;column-gap:2rem;row-gap:2.2rem;padding:1.6rem;background:#fff;text-align:start;animation:sq-in .48s var(--sq-ease) 80ms backwards}.scent-quiz__result-media{grid-area:media;height:13.5rem}.scent-quiz__result-media img,.scent-quiz__result-media svg{display:block;width:100%;height:100%;object-fit:contain}.scent-quiz__result-head{grid-area:head;display:flex;flex-direction:column;gap:.8rem}.scent-quiz__result-title{margin:0;font-family:var(--font-heading-family);font-weight:800;font-size:2.2rem;line-height:1.2;text-transform:uppercase;color:var(--sq-ink)}.scent-quiz__result-badge,.scent-quiz__result-label{font-family:var(--font-button-family);font-size:1.2rem;line-height:1.2;letter-spacing:.117em;text-transform:uppercase}.scent-quiz__result-badge{font-weight:500;color:var(--sq-red)}.scent-quiz__result-inspiration{grid-area:insp;display:flex;flex-direction:column;gap:1rem}.scent-quiz__result-label{font-weight:600;color:var(--sq-purple)}.scent-quiz__result-inspiration p{margin:0;font-family:var(--font-body-family);font-size:1.4rem;line-height:2.2rem;color:#000}.scent-quiz__result-actions{grid-area:actions;display:flex;flex-direction:column;align-items:center;gap:1.9rem}.scent-quiz__retake{padding:.4rem;border:0;background:none;font-family:var(--font-button-family);font-size:var(--button-font-size);font-weight:var(--button-font-weight);letter-spacing:var(--button-letter-spacing);text-transform:uppercase;text-underline-offset:.4rem;color:var(--sq-purple);cursor:pointer}.scent-quiz__retake:hover{text-decoration:underline}.scent-quiz__retake:focus-visible{outline:.2rem solid var(--sq-purple);outline-offset:.2rem}@media screen and (min-width:750px){.scent-quiz__result{grid-template-columns:minmax(0,31.6rem) minmax(0,43.7rem);grid-template-rows:auto auto 1fr;grid-template-areas:"media head" "media insp" "media actions";align-items:start;row-gap:2rem;padding:3.7rem 4.1rem}.scent-quiz__result-media{height:auto;aspect-ratio:316 / 327}.scent-quiz__result-head{flex-direction:row;align-items:flex-end;justify-content:space-between;gap:2rem}.scent-quiz__result-title{font-size:3.2rem;letter-spacing:-.05em}.scent-quiz__result-badge{padding-block:.5rem;text-align:end}.scent-quiz__result-inspiration p{max-width:32.2rem}.scent-quiz__result-actions{align-self:end;gap:2.6rem}}@keyframes sq-in{0%{opacity:0;transform:translateY(1.2rem)}}@keyframes sq-pop{0%{opacity:0;transform:translateY(1.6rem) scale(.97)}}@keyframes sq-fade{0%{opacity:0}}@keyframes sq-shake{20%{transform:translate(-.6rem)}40%{transform:translate(.6rem)}60%{transform:translate(-.4rem)}80%{transform:translate(.4rem)}}@media(prefers-reduced-motion:reduce){.scent-quiz *,.scent-quiz__dialog,.scent-quiz__dialog::backdrop{animation-duration:1ms!important;animation-delay:0ms!important;transition-duration:1ms!important}}
/*# sourceMappingURL=/cdn/shop/t/21/assets/section-scent-quiz.css.map */