.mix-your-own{background-color:rgb(var(--color-background));padding:4rem 0 6rem;font-family:var(--font-body-family);color:rgb(var(--color-foreground))}.mix-your-own__header{text-align:center;max-width:60rem;margin:0 auto 4rem;padding:0 1.5rem}.mix-your-own__subtitle{font-size:1.2rem;letter-spacing:.2em;text-transform:uppercase;color:#b8860b;margin-bottom:1rem;font-weight:500}.mix-your-own__title{font-family:var(--font-heading-family);font-size:clamp(3.2rem,6vw,5rem);font-weight:400;line-height:1.15;margin:0 0 1.5rem;color:rgb(var(--color-foreground))}.mix-your-own__description{font-size:1.5rem;line-height:1.7;color:rgba(var(--color-foreground),.6);margin:0}.mix-your-own__description strong{color:rgb(var(--color-foreground));font-weight:500}.mix-your-own__layout{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;max-width:100rem;margin:0 auto;padding:0 5rem}@media screen and (max-width:749px){.mix-your-own__layout{grid-template-columns:1fr;gap:3rem;padding:0 1.5rem}}.mix-your-own__bottle-wrap{display:flex;justify-content:center;align-items:center}.mix-your-own__bottle-svg{width:100%;max-width:22.4rem;height:auto}.mix-your-own__bottle-svg .bottle-outline{fill:none;stroke:#b8860b;stroke-width:1.5;opacity:.6}.mix-your-own__bottle-svg .bottle-cap{fill:#a0730a}.mix-your-own__bottle-svg .bottle-cap-top{fill:#b8860b}.mix-your-own__bottle-svg .bottle-layer-a,.mix-your-own__bottle-svg .bottle-layer-b{fill:transparent;transition:fill .6s ease,opacity .6s ease;opacity:0}.mix-your-own__bottle-svg .bottle-layer-a.active,.mix-your-own__bottle-svg .bottle-layer-b.active{opacity:.7}.mix-your-own__bottle-svg .bottle-label{fill:none;stroke:#b8860b66;stroke-width:1}.mix-your-own__card{border:1px solid rgba(var(--color-foreground),.1);padding:3rem}@media screen and (max-width:749px){.mix-your-own__card{padding:2rem}}.mix-your-own__card-heading{display:flex;align-items:center;gap:.8rem;margin-bottom:2.5rem}.mix-your-own__card-icon{font-size:1.4rem;color:#b8860b}.mix-your-own__card-label{font-size:1.1rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(var(--color-foreground),.5);font-weight:500}.mix-your-own__field{margin-bottom:2rem}.mix-your-own__field-row{display:flex;gap:1rem;align-items:stretch}.mix-your-own__field-row .mix-custom-select{flex:1 1 75%}.mix-your-own__select--hidden{display:none}.mix-your-own__percent-select{flex:0 0 8rem;width:8rem;padding:1.3rem 2.5rem 1.3rem 1rem;font-size:1.4rem;font-family:var(--font-body-family);border:1px solid rgba(var(--color-foreground),.15);background-color:rgb(var(--color-background));color:#b8860b;font-weight:600;border-radius:0;appearance:none;-webkit-appearance:none;cursor:pointer;text-align:center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%236b6b6b' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8rem center;transition:border-color .2s ease}.mix-your-own__percent-select:hover{border-color:rgba(var(--color-foreground),.35)}.mix-your-own__percent-select:focus{outline:none;border-color:#b8860b}.mix-your-own__field-label{display:block;font-size:1.1rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:rgba(var(--color-foreground),.7);margin-bottom:.8rem}.mix-your-own__select,.mix-your-own__input{width:100%;padding:1.3rem 1.5rem;font-size:1.4rem;font-family:var(--font-body-family);border:1px solid rgba(var(--color-foreground),.15);background-color:rgb(var(--color-background));color:rgb(var(--color-foreground));border-radius:0;appearance:none;-webkit-appearance:none;transition:border-color .2s ease}.mix-your-own__select{cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%236b6b6b' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1.5rem center;padding-right:3.5rem}.mix-your-own__select:hover,.mix-your-own__input:hover{border-color:rgba(var(--color-foreground),.35)}.mix-your-own__select:focus,.mix-your-own__input:focus{outline:none;border-color:#b8860b}.mix-your-own__input::placeholder{color:rgba(var(--color-foreground),.4)}.mix-your-own__button{width:100%;padding:1.5rem 3rem;margin-top:.5rem;font-size:1.2rem;font-family:var(--font-body-family);font-weight:500;letter-spacing:.18em;text-transform:uppercase;background-color:#b8860b;color:#fff;border:none;border-radius:0;cursor:pointer;transition:opacity .2s ease,background-color .2s ease}.mix-your-own__button:hover{background-color:#a0730a}.mix-your-own__button:disabled{opacity:.45;cursor:not-allowed}.mix-your-own__footer-text{text-align:center;font-size:1rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(var(--color-foreground),.4);margin-top:2rem}.mix-your-own__toast{position:fixed;bottom:2rem;right:2rem;background-color:#1a1a1a;color:#fff;padding:1.4rem 2.5rem;font-size:1.3rem;font-family:var(--font-body-family);letter-spacing:.05em;z-index:9999;opacity:0;transform:translateY(1rem);transition:opacity .3s ease,transform .3s ease;pointer-events:none}.mix-your-own__toast.visible{opacity:1;transform:translateY(0);pointer-events:auto}.mix-your-own__button.loading{pointer-events:none;opacity:.6}.mix-your-own__select.loading{opacity:.5;pointer-events:none}.mix-your-own__bottle-svg .bottle-swirl{fill:none;stroke:#b8860b73;stroke-width:1.8}.mix-your-own__bottle-svg .bottle-spin-ring{fill:none;stroke:#b8860b00;stroke-width:1.5;transform-box:fill-box;transform-origin:50% 50%}.mix-your-own__bottle-svg.is-mixing .bottle-spin-ring{stroke:#b8860b59;animation:mix-ring-spin 1.6s ease-in-out forwards}.mix-your-own__bottle-svg.is-mixing .bottle-layer-a{animation:mix-layer-pulse 1.6s ease-in-out}.mix-your-own__bottle-svg.is-mixing .bottle-layer-b{animation:mix-layer-pulse 1.6s ease-in-out .12s}.mix-your-own__bottle-svg.is-mixing .bottle-swirl{animation:swirl-brighten 1.6s ease-in-out}@keyframes mix-ring-spin{0%{transform:rotate(0)}to{transform:rotate(720deg)}}@keyframes mix-layer-pulse{0%{opacity:.7}25%{opacity:1}55%{opacity:.4}80%{opacity:1}to{opacity:.7}}@keyframes swirl-brighten{0%{opacity:1}35%{opacity:2.2}65%{opacity:.3}85%{opacity:1.8}to{opacity:1}}.mix-custom-select{position:relative;cursor:pointer;-webkit-user-select:none;user-select:none}.mix-custom-select__trigger{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.2rem 1.5rem;border:1px solid rgba(var(--color-foreground),.15);background-color:rgb(var(--color-background));transition:border-color .2s ease;min-height:5.2rem}.mix-custom-select:hover .mix-custom-select__trigger,.mix-custom-select.open .mix-custom-select__trigger{border-color:#b8860b}.mix-custom-select__trigger-text{display:flex;flex-direction:column;gap:.15rem;min-width:0;flex:1}.mix-custom-select__placeholder{font-size:1.4rem;font-family:var(--font-body-family);color:rgba(var(--color-foreground),.4)}.mix-custom-select__selected-name{font-size:1.4rem;font-family:var(--font-body-family);color:rgb(var(--color-foreground));font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mix-custom-select__selected-sub{font-size:1.05rem;font-family:var(--font-body-family);color:#b8860b;font-style:italic;letter-spacing:.03em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mix-custom-select__arrow{flex-shrink:0;color:rgba(var(--color-foreground),.4);transition:transform .2s ease}.mix-custom-select.open .mix-custom-select__arrow{transform:rotate(180deg)}.mix-custom-select__dropdown{display:none;position:absolute;top:calc(100% + 1px);left:0;right:0;background-color:rgb(var(--color-background));border:1px solid rgba(var(--color-foreground),.15);border-top:none;z-index:200;max-height:30rem;overflow-y:auto;box-shadow:0 8px 24px #00000014}.mix-custom-select.open .mix-custom-select__dropdown{display:block}.mix-custom-select__option{padding:1.2rem 1.5rem;cursor:pointer;border-bottom:1px solid rgba(var(--color-foreground),.06);transition:background-color .15s ease}.mix-custom-select__option:last-child{border-bottom:none}.mix-custom-select__option:hover,.mix-custom-select__option.selected{background-color:#b8860b12}.mix-custom-select__option-name{font-size:1.4rem;font-family:var(--font-body-family);color:rgb(var(--color-foreground));font-weight:500;line-height:1.3}.mix-custom-select__option-sub{font-size:1.05rem;font-family:var(--font-body-family);color:#b8860b;font-style:italic;letter-spacing:.03em;margin-top:.2rem}.mix-custom-select.loading .mix-custom-select__trigger{opacity:.5;pointer-events:none}.mix-custom-select__search{padding:.8rem 1rem;border-bottom:1px solid rgba(var(--color-foreground),.1);position:sticky;top:0;background-color:rgb(var(--color-background));z-index:1}.mix-custom-select__search-input{width:100%;padding:.7rem 1rem;font-size:1.3rem;font-family:var(--font-body-family);color:rgb(var(--color-foreground));background-color:rgb(var(--color-background));border:1px solid rgba(var(--color-foreground),.15);outline:none;transition:border-color .2s ease}.mix-custom-select__search-input:focus{border-color:#b8860b}.mix-custom-select__search-input::placeholder{color:rgba(var(--color-foreground),.35);font-style:italic}
/*# sourceMappingURL=/cdn/shop/t/14/assets/mix-your-own.css.map */