.variant-360{width:100%;max-width:1536px;margin:3rem auto;padding-left:1rem;padding-right:1rem}@media (min-width:640px){.variant-360{margin-top:5rem;margin-bottom:5rem}}.variant-360__container{flex-direction:column;align-items:center;gap:2rem;width:100%;display:flex}.variant-360__header{width:100%}.variant-360__stage{flex-direction:column;align-items:center;width:100%;max-width:1096px;display:flex;position:relative}.variant-360__frame-box{z-index:10;aspect-ratio:16/9;border-radius:var(--radius);--tw-bg-opacity:1;background-color:rgba(244,244,244,var(--tw-bg-opacity,1));width:100%;position:relative;overflow:hidden}.variant-360__viewer,.variant-360__fallback{width:100%;height:100%;position:absolute;top:0;bottom:0;left:0;right:0}.variant-360__viewer--hidden{display:none}.variant-360__fallback-image{object-fit:contain}.variant-360__controls{z-index:20;direction:ltr;justify-content:center;align-items:center;gap:1rem;margin-top:.75rem;display:flex;position:relative}.variant-360__arrow{cursor:pointer;--tw-text-opacity:1;width:2.25rem;height:2.25rem;color:rgba(164,137,108,var(--tw-text-opacity,1));justify-content:center;align-items:center;font-size:1.5rem;line-height:1;transition-property:color,background-color,border-color,-webkit-text-decoration-color,text-decoration-color,fill,stroke;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:.2s;display:flex}.variant-360__arrow:hover{--tw-text-opacity:1;color:rgba(33,33,33,var(--tw-text-opacity,1))}.variant-360__arrow:focus{outline-offset:2px;outline:2px solid transparent}.variant-360__arrow:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgba(164,137,108,var(--tw-ring-opacity,1))}.variant-360__hint{-webkit-user-select:none;-moz-user-select:none;user-select:none;text-transform:uppercase;letter-spacing:.2em;--tw-text-opacity:1;color:rgba(164,137,108,var(--tw-text-opacity,1));font-size:.875rem;font-weight:500;line-height:1.25rem}.variant-360__selection{flex-direction:column;align-items:center;gap:1rem;width:100%;display:flex}.variant-360__swatches{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;padding-left:0;display:flex}.variant-360__swatch-item>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px * var(--tw-space-y-reverse))}.variant-360__swatch-button{cursor:pointer;border-radius:calc(var(--radius) - 2px);transition-property:all;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);animation-duration:.2s;display:flex}.variant-360__swatch-button:focus{outline-offset:2px;outline:2px solid transparent}.variant-360__swatch-button:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgba(164,137,108,var(--tw-ring-opacity,1));--tw-ring-offset-width:2px}.variant-360__swatch-button--selected{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgba(164,137,108,var(--tw-ring-opacity,1));--tw-ring-offset-width:2px}.variant-360__swatch{border-radius:calc(var(--radius) - 2px);width:3rem;height:3rem;display:block;position:relative;overflow:hidden}.variant-360__swatch--filled{--tw-border-opacity:1;border-width:1px;border-color:rgba(235,235,235,var(--tw-border-opacity,1))}.variant-360__swatch-image{object-fit:cover}.variant-360__color-info{text-align:center}.variant-360__color-name{font-family:var(--font-inter-tight), sans-serif;--tw-text-opacity:1;color:rgba(33,33,33,var(--tw-text-opacity,1));font-size:1.125rem;font-weight:400;line-height:1.75rem}.variant-360__color-finish{font-family:var(--font-inter-tight), sans-serif;--tw-text-opacity:1;color:rgba(94,94,94,var(--tw-text-opacity,1));font-size:.875rem;line-height:1.25rem}.variant-360[dir=rtl] .variant-360__swatches{flex-direction:row-reverse}.variant-360-viewer{cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:pan-y;width:100%;height:100%}.variant-360-viewer:active{cursor:grabbing}.variant-360-viewer__frame{pointer-events:none;opacity:0}.variant-360-viewer__frame--active{opacity:1}.variant-360-viewer .variant-360-viewer__frame{object-fit:cover}.variant-360-viewer__loader{z-index:20;--tw-backdrop-blur:blur(4px);-webkit-backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);background-color:rgba(244,244,244,.7);justify-content:center;align-items:center;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}.variant-360-loader{flex-direction:column;align-items:center;gap:.5rem;width:100%;max-width:20rem;padding-left:1.5rem;padding-right:1.5rem;display:flex}.variant-360-loader__track{background-color:rgba(235,235,235,.5);border-radius:9999px;width:100%;height:.375rem;display:block;position:relative;overflow:hidden}.variant-360-loader__fill{--tw-bg-opacity:1;background-color:rgba(164,137,108,var(--tw-bg-opacity,1));transform-origin:0;will-change:transform;width:100%;transition:transform .4s cubic-bezier(.33,1,.68,1);position:absolute;top:0;bottom:0;left:0;transform:scaleX(0)}.variant-360-loader__track:after{content:"";pointer-events:none;will-change:transform;background:linear-gradient(90deg,transparent 15%,rgba(255,255,255,.5) 50%,transparent 85%);animation:1.8s ease-in-out infinite variant-360-shimmer;position:absolute;top:0;bottom:0;left:0;right:0;transform:translate(-100%)}.variant-360-loader__pct{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction);--tw-text-opacity:1;color:rgba(94,94,94,var(--tw-text-opacity,1));font-size:.875rem;font-weight:500;line-height:1.25rem}@media (prefers-reduced-motion:reduce){.variant-360-loader__fill{transition:none}.variant-360-loader__track:after{display:none}}@keyframes variant-360-shimmer{to{transform:translate(100%)}}