/* SOCIUS interaction / motion polish */

/* Hero depth: the bottle art moves independently of the existing scroll drift. */
.visual-hero{--hero-light-x:72%;--hero-light-y:20%}
.visual-hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at var(--hero-light-x) var(--hero-light-y),rgba(255,255,255,.34),transparent 25%);mix-blend-mode:screen;opacity:.75;transition:opacity .3s ease}
.visual-stage .preview-bottle img{--mouse-x:0px;--mouse-y:0px;--scroll-lift:0px;transform:translate3d(var(--mouse-x),calc(var(--mouse-y) + var(--scroll-lift)),0) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg));transform-origin:50% 72%;will-change:transform;transition:filter .35s ease,transform .14s ease-out}
.visual-stage .preview-bottle:hover img{transform:translate3d(var(--mouse-x),calc(var(--mouse-y) + var(--scroll-lift) - 5px),0) rotateX(var(--tilt-y,0deg)) rotateY(var(--tilt-x,0deg)) scale(1.008)}

/* Cursor-following light and restrained scroll parallax on the three campaign cards. */
.campaign-mosaic .campaign-shot{--spot-x:50%;--spot-y:40%;--card-scroll:0px;isolation:isolate}
.campaign-mosaic .campaign-shot:before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle 190px at var(--spot-x) var(--spot-y),rgba(255,255,255,.19),rgba(255,255,255,.045) 38%,transparent 68%);opacity:.72;transition:opacity .25s ease}
.campaign-mosaic .campaign-shot:hover:before{opacity:1}
.campaign-mosaic .campaign-shot img{transform:translate3d(0,var(--card-scroll),0)!important;will-change:transform;transition:transform .18s ease-out,filter .4s ease!important}
.campaign-mosaic .campaign-shot:hover img{transform:translate3d(0,calc(var(--card-scroll) - 5px),0) scale(1.008)!important}

/* Product-world cards get the same material light language. */
.visual-world-card{--spot-x:50%;--spot-y:28%;--card-scroll:0px}
.visual-world-card:after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(circle 180px at var(--spot-x) var(--spot-y),rgba(255,255,255,.24),transparent 67%);opacity:.55;transition:opacity .25s ease}
.visual-world-card:hover:after{opacity:.9}
.visual-world-card img{transform:translateX(-50%) translateY(var(--card-scroll))!important;will-change:transform}
.visual-world-card:hover img{transform:translateX(-50%) translateY(calc(var(--card-scroll) - 8px)) scale(1.012)!important}

/* Magnetic buttons use the translate longhand so they don't stomp existing hover transforms. */
.pill,.pill-dark,.checkout,.vote,.community-cta{--mag-x:0px;--mag-y:0px;translate:var(--mag-x) var(--mag-y);will-change:translate;transition:translate .16s cubic-bezier(.2,.8,.2,1),background .25s ease,color .25s ease,border-color .25s ease}

/* Product page presentation — restrained, staggered entrance. */
.product-detail.motion-product .product-visual img{animation:sociusProductRise .82s cubic-bezier(.18,.78,.2,1) both}
.product-detail.motion-product .product-copy>.eyebrow{animation:sociusCopyIn .58s .08s ease both}
.product-detail.motion-product .product-copy>h1{animation:sociusCopyIn .66s .14s cubic-bezier(.2,.75,.2,1) both}
.product-detail.motion-product .product-copy>.lede{animation:sociusCopyIn .62s .2s ease both}
.product-detail.motion-product .product-copy>.addrow{animation:sociusCopyIn .58s .26s ease both}
@keyframes sociusProductRise{from{opacity:.65;transform:translateY(calc(-3vh + 28px)) scale(.985)}to{opacity:1;transform:translateY(-3vh) scale(1)}}
@keyframes sociusCopyIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Keep the native cursor on product cards. */
#sociusViewCursor{display:none!important}

/* Give section reveals slightly different travel distances instead of one uniform fade. */
.preview-editorial-head.reveal,.visual-world-head.reveal{transform:translateY(18px)}
.campaign-shot.reveal,.visual-world-card.reveal{transform:translateY(24px) scale(.992)}
.preview-editorial-head.reveal.in,.visual-world-head.reveal.in,.campaign-shot.reveal.in,.visual-world-card.reveal.in{transform:none}

@media(max-width:700px),(pointer:coarse){
  .visual-stage .preview-bottle img{transform:translate3d(0,var(--scroll-lift),0)}
  .campaign-mosaic .campaign-shot:before,.visual-world-card:after{display:none}
  .pill,.pill-dark,.checkout,.vote,.community-cta{translate:none!important}
}

@media(prefers-reduced-motion:reduce){
  .visual-stage .preview-bottle img,.campaign-mosaic .campaign-shot img,.visual-world-card img{transform:none!important}
  .product-detail.motion-product .product-visual img,.product-detail.motion-product .product-copy>*{animation:none!important}
  .pill,.pill-dark,.checkout,.vote,.community-cta{translate:none!important}
}