.orb-scene{position:relative;overflow:hidden;isolation:isolate;perspective:1100px;min-height:600px;background:radial-gradient(ellipse at 52% 37%,#fff7ba,#fbc938 40%,#d8780d);color:#063f45;touch-action:pan-y;transition:background .5s}
.orb-depth{position:absolute;inset:4% 7% 20%;transform-style:preserve-3d;transform:translate3d(var(--mx,0px),calc(var(--my,0px) + var(--scroll-y,0px)),0) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .4s ease-out;z-index:2;pointer-events:none}
.orb-float{height:100%;width:100%;position:relative;transform-style:preserve-3d;animation:orb-levitate 6s ease-in-out infinite;will-change:transform}
#orb-photo{height:100%;width:100%;object-fit:cover;border-radius:42% 42% 14px 14px;box-shadow:0 30px 50px #5f2d0630;transition:opacity .2s}
#orb-bottle{position:absolute;inset:0;height:100%;width:100%;object-fit:contain;display:none;filter:drop-shadow(14px 20px 10px #8c3a1225);transform:translateZ(65px)}
.is-mango.cutout-ready #orb-bottle{display:block}.is-mango.cutout-ready #orb-photo{visibility:hidden}
.orb-word{position:absolute;top:25%;left:-5%;width:110%;text-align:center;font-family:'Outfit',sans-serif;font-size:clamp(75px,10vw,180px);font-weight:800;letter-spacing:-.05em;line-height:1;color:#ffffff55;transform:translate3d(calc(var(--mx,0px) * -.6),calc(var(--my,0px) * -.6),0) rotate(-10deg);transition:transform .6s;pointer-events:none;z-index:0}
.orb-shadow{position:absolute;left:28%;bottom:23%;width:44%;height:5%;background:#84380955;border-radius:50%;filter:blur(13px);animation:orb-shadow 6s ease-in-out infinite;z-index:1;pointer-events:none}
.orb-caption{position:absolute;bottom:30px;left:32px;z-index:4}.orb-caption span{font-size:13px;font-weight:700}.orb-caption h2{font-family:'Outfit',sans-serif;font-size:clamp(32px,3.7vw,58px);line-height:1.1;margin:8px 0}.orb-caption p{font-size:15px;margin:0}.orb-arrows{position:absolute;right:26px;bottom:30px;display:flex;gap:10px;z-index:4}.orb-arrows button{width:46px;height:46px;border:1px solid #063f4580;border-radius:50%;background:#fff8;color:#063f45;font-size:23px;cursor:pointer}.orb-arrows button:hover{background:#fff}
#orb-motion{position:absolute;right:22px;top:20px;border:1px solid #063f4570;border-radius:30px;background:#fff9;color:#063f45;padding:10px 16px;font:600 14px 'Manrope',sans-serif;z-index:5;cursor:pointer}
.orb-arrows button:focus-visible,#orb-motion:focus-visible,.orb-product-button:focus-visible{outline:3px solid #f06b42;outline-offset:4px}
.flavour{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .4s ease-out,box-shadow .4s}.flavour:hover{transform:perspective(900px) translateY(-7px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}.orb-product-button{font:700 14px 'Manrope',sans-serif;background:#063f45;color:#fff;border:0;padding:13px 16px;margin:0 20px 20px;border-radius:25px;cursor:pointer}.orb-product-button:hover{background:#0b5860}
.orb-paused *, .orb-paused *::before{animation-play-state:paused!important}
@keyframes orb-levitate{0%,100%{transform:translate3d(0,12px,0) rotateZ(-5deg) rotateY(-7deg)}50%{transform:translate3d(0,-22px,35px) rotateZ(5deg) rotateY(8deg)}}
@keyframes orb-shadow{0%,100%{transform:scale(1.05);opacity:.55}50%{transform:scale(.74);opacity:.24}}
@media(max-width:900px){.orb-scene{min-height:650px}.orb-word{font-size:20vw}.orb-depth{inset:5% 12% 22%}}
@media(max-width:560px){.orb-scene{min-height:0;height:132vw;max-height:650px}.orb-depth{inset:7% 9% 24%}.orb-word{font-size:23vw;top:30%}.orb-shadow{bottom:28%}#orb-bottle{transform:translateZ(35px)}.orb-caption{bottom:27px;left:22px}.orb-caption h2{font-size:34px}.orb-arrows{bottom:27px;right:20px;gap:7px}.orb-arrows button{width:40px;height:40px}.orb-caption p{max-width:190px;font-size:14px}}
@media(prefers-reduced-motion:reduce){.orb-float,.orb-shadow{animation:none!important}.orb-depth,.flavour,.flavour:hover,.orb-word{transform:none!important;transition:none!important}.orb-float{transform:rotate(-3deg)}}