.flavor-wheel{--fw-gap: clamp(28px, 5vw, 72px);--fw-anchor: 0;color:var(--fw-text, #2c2d2e)}.flavor-wheel__layout{position:relative;display:grid;grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,4fr);gap:var(--fw-gap);align-items:center}.flavor-wheel__intro{position:relative;z-index:1;min-width:0}.flavor-wheel--wheel-right .flavor-wheel__panel{order:1}.flavor-wheel--wheel-right .flavor-wheel__media{order:2}.flavor-wheel--wheel-right .flavor-wheel__intro{order:3}.flavor-wheel.is-instant .flavor-wheel__ring,.flavor-wheel.is-instant .flavor-wheel__label-spin{transition:none!important}.flavor-wheel__connector{position:absolute;top:0;left:0;overflow:visible;pointer-events:none;z-index:2;opacity:0;transition:opacity .2s ease}.flavor-wheel.is-connected .flavor-wheel__connector{opacity:1}.flavor-wheel__connector-path{fill:none;stroke:var(--fw-active, var(--fw-accent, #7b8e72));stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;transition:stroke-dashoffset .45s cubic-bezier(.4,0,.2,1)}.flavor-wheel__connector-dot{fill:var(--fw-active, var(--fw-accent, #7b8e72));stroke:#fff;stroke-width:2;transition:fill .3s ease}.flavor-wheel__media{position:relative;display:flex;flex-direction:column;width:100%;max-width:520px;margin:0 auto}.flavor-wheel__wheel{position:relative;aspect-ratio:1 / 1}.flavor-wheel__svg{display:block;width:100%;height:100%;overflow:visible}.flavor-wheel__ring{transform-box:view-box;transform-origin:200px 200px;transform:rotate(var(--fw-rot, 0deg));transition:transform .9s cubic-bezier(.22,1,.36,1)}.flavor-wheel__seg{cursor:pointer;outline:none}.flavor-wheel__arc{fill:none;stroke:var(--note-color, var(--fw-accent, #7b8e72));stroke-width:78;opacity:.82;transition:stroke-width .25s ease,opacity .3s ease}.flavor-wheel__seg:hover .flavor-wheel__arc,.flavor-wheel__seg:focus-visible .flavor-wheel__arc{stroke-width:84;opacity:1}.flavor-wheel__seg.is-active .flavor-wheel__arc{stroke-width:90;opacity:1}.flavor-wheel__seg:focus-visible .flavor-wheel__arc{filter:drop-shadow(0 0 0 2px var(--fw-heading, #1a1c1d))}.flavor-wheel__label-spin{transform-box:view-box;transform-origin:0 0;transform:rotate(calc(-1 * var(--seg-angle, 0deg) - var(--fw-rot, 0deg)));transition:transform .9s cubic-bezier(.22,1,.36,1)}.flavor-wheel__label{font-family:inherit;font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;fill:var(--label-color, #fff);opacity:.9;pointer-events:none;transition:opacity .3s ease}.flavor-wheel__seg.is-active .flavor-wheel__label{opacity:1}.flavor-wheel__hub{position:absolute;top:24%;right:24%;bottom:24%;left:24%;border-radius:50%;overflow:hidden;background:transparent;box-shadow:0 18px 36px -18px #00000073;pointer-events:none}.flavor-wheel__image{display:block;width:100%;height:100%;object-fit:cover}.flavor-wheel__image--placeholder{background:rgba(var(--fw-accent-rgb, 123, 142, 114),.15);fill:rgba(var(--fw-accent-rgb, 123, 142, 114),.6)}.flavor-wheel__hint{margin:14px 0 0;text-align:center;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--fw-accent-own, #7b8e72);opacity:.85}.flavor-wheel__eyebrow{margin:0 0 12px;font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--fw-accent, #7b8e72)}.flavor-wheel__eyebrow-inner{display:inline-flex;align-items:center;gap:10px}.flavor-wheel__eyebrow-dash{display:inline-block;flex:0 0 auto;width:28px;height:3px;border-radius:3px;background:currentColor}.flavor-wheel__heading{margin:0 0 12px;color:var(--fw-heading, #1a1c1d);line-height:1.1}.flavor-wheel__heading .animated-marker{white-space:nowrap}.flavor-wheel__text{color:var(--fw-text, #2c2d2e);line-height:1.6}.flavor-wheel__text p:last-child{margin-bottom:0}.flavor-wheel__panel{position:relative;margin-top:0;padding:20px 22px 22px;border-radius:18px;background:var(--fw-panel, #f5f2ea);border-top:4px solid var(--fw-active, var(--fw-marker, #f2b75b));min-height:150px;opacity:0;transform:translateY(-10px) scaleY(.92);transform-origin:top center;transition:opacity .35s ease,transform .35s cubic-bezier(.22,1,.36,1),border-color .4s ease}.flavor-wheel__panel.is-open{opacity:1;transform:none}.flavor-wheel__note{opacity:0;transform:translateY(6px);transition:opacity .3s ease .12s,transform .3s ease .12s}.flavor-wheel__panel.is-open .flavor-wheel__note{opacity:1;transform:none}.flavor-wheel__swatch{display:inline-block;width:.6em;height:.6em;margin-right:.35em;border-radius:50%;vertical-align:.08em;box-shadow:inset 0 0 0 1px #00000014}.flavor-wheel__note-name{margin:0 0 8px;font-size:clamp(1.4rem,2.2vw,1.75rem);line-height:1.1;color:var(--fw-heading, #1a1c1d)}.flavor-wheel__note-text{font-size:.95rem;line-height:1.6;color:var(--fw-text, #2c2d2e)}.flavor-wheel__note-text p:last-child{margin-bottom:0}.flavor-wheel__related-label{margin:14px 0 8px;font-size:.68rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--fw-accent, #7b8e72)}.flavor-wheel__related{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}.flavor-wheel__pill{display:inline-block;padding:6px 12px;border-radius:999px;border:1px solid rgba(var(--fw-accent-rgb, 123, 142, 114),.35);background:#fff;color:var(--fw-heading, #1a1c1d);font-size:.82rem;font-weight:600;line-height:1.3;text-decoration:none;transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease}a.flavor-wheel__pill:hover,a.flavor-wheel__pill:focus-visible{background:var(--fw-accent, #7b8e72);border-color:var(--fw-accent, #7b8e72);color:var(--fw-on-accent, #fff);transform:translateY(-1px)}.flavor-wheel__more{display:inline-flex;align-items:center;gap:6px;margin-top:14px;font-size:.88rem;font-weight:600;color:var(--fw-heading, #1a1c1d);text-decoration:underline;text-decoration-color:var(--fw-active, var(--fw-accent, #7b8e72));text-decoration-thickness:2px;text-underline-offset:4px;transition:color .2s ease,gap .2s ease}.flavor-wheel__more:hover,.flavor-wheel__more:focus-visible{color:var(--fw-active, var(--fw-accent, #7b8e72));gap:10px}.flavor-wheel__more svg{flex:0 0 auto}.flavor-wheel__actions{margin-top:22px}.flavor-wheel .flavor-wheel__button{margin:0;background:var(--fw-button, #7b8e72);border-color:var(--fw-button, #7b8e72);color:var(--fw-button-text, #fff);box-shadow:0 10px 20px -12px #0006;transition:transform .2s ease,filter .2s ease,box-shadow .2s ease}.flavor-wheel .flavor-wheel__button:hover,.flavor-wheel .flavor-wheel__button:focus{background:var(--fw-button, #7b8e72);border-color:var(--fw-button, #7b8e72);color:var(--fw-button-text, #fff);filter:brightness(.94);transform:translateY(-2px);box-shadow:0 14px 24px -12px #00000073}.flavor-wheel__footnote{margin:18px 0 0;font-size:.74rem;line-height:1.5;color:var(--fw-text, #2c2d2e);opacity:.65}.flavor-wheel--animate [data-reveal]{opacity:0;translate:0 18px;transition:opacity .6s ease,translate .7s cubic-bezier(.22,1,.36,1);transition-delay:calc(var(--i, 0) * 80ms)}.flavor-wheel--animate .flavor-wheel__media[data-reveal]{translate:0 0;scale:.94;transition:opacity .6s ease,scale .9s cubic-bezier(.22,1,.36,1)}.flavor-wheel--animate [data-reveal].is-revealed{opacity:1;translate:0 0;scale:1}@media(prefers-reduced-motion:reduce){.flavor-wheel__ring,.flavor-wheel__label-spin,.flavor-wheel__arc,.flavor-wheel__note,.flavor-wheel__panel,.flavor-wheel__connector,.flavor-wheel__connector-path,.flavor-wheel__pill,.flavor-wheel .flavor-wheel__button{transition:none!important}.flavor-wheel--animate [data-reveal]{opacity:1;translate:0 0;scale:1;transition:none}}@media screen and (max-width:1023px){.flavor-wheel{--fw-gap: clamp(18px, 3vw, 36px)}.flavor-wheel__layout{grid-template-columns:minmax(0,4fr) minmax(0,5fr) minmax(0,4fr)}.flavor-wheel__panel{padding:16px 16px 18px}.flavor-wheel__label{font-size:12.5px}}@media screen and (max-width:767px){.flavor-wheel{--fw-anchor: 180}.flavor-wheel__layout{grid-template-columns:1fr;gap:0}.flavor-wheel--wheel-right .flavor-wheel__intro,.flavor-wheel--wheel-right .flavor-wheel__media,.flavor-wheel--wheel-right .flavor-wheel__panel{order:0}.flavor-wheel__intro{margin-bottom:28px}.flavor-wheel__media{max-width:92%}.flavor-wheel__hint{order:-1;margin:0 0 14px}.flavor-wheel__panel{margin-top:44px;padding:18px 18px 20px}.flavor-wheel__label{font-size:13.5px}}@media screen and (max-width:479px){.flavor-wheel__label{font-size:15px;letter-spacing:.04em}.flavor-wheel .flavor-wheel__button{width:100%;text-align:center}}
/*# sourceMappingURL=/cdn/shop/t/662/assets/flavor-wheel.css.map */