/* Real CSS perspective keeps motion light without loading a 3D engine. */
.world-grid{gap:28px}
.world-card,.js-motion .world-card.reveal.visible{overflow:visible;isolation:auto;transform-style:preserve-3d;transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));background:transparent;border:0;box-shadow:0 20px 45px #0004;transition:transform .55s cubic-bezier(.2,.65,.3,1),box-shadow .5s;z-index:1}
.world-card:after{display:none}
.world-card.is-tilting{transition:transform .12s linear,box-shadow .4s;z-index:2;box-shadow:0 32px 55px #0008}
.depth-surface{display:block;position:absolute;inset:0;overflow:hidden;border-radius:12px;background:#150e15;border:1px solid #d4b89a50;transform:translateZ(0)}
.depth-surface:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#08060c55,transparent 38%,#08060c35 65%,#08060ccc);pointer-events:none}
.depth-surface .collection-image{z-index:auto;transform:scale(1.04) translate(var(--image-x,0px),var(--image-y,0px));transition:transform .45s ease-out}
.world-card:hover .collection-image,.world-card:focus-visible .collection-image{transform:scale(1.07) translate(var(--image-x,0px),var(--image-y,0px))}
.depth-glint{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(circle at var(--light-x,50%) var(--light-y,35%),#fff2da30,transparent 55%);opacity:0;transition:opacity .5s}
.world-card.is-tilting .depth-glint{opacity:1}
.world-card .world-no{display:block;transform:translateZ(20px);pointer-events:none}
.world-card .world-label{transform:translateZ(36px);pointer-events:none;text-shadow:0 8px 20px #0009}
.world-card:focus-visible{outline:2px solid #f2dab9;outline-offset:8px}
.motion-paused .world-card,.motion-paused.js-motion .world-card.reveal.visible{transform:none!important;transition:none!important}
.motion-paused .world-label,.motion-paused .world-no{transform:none}
.motion-paused .depth-glint{opacity:0!important}
.motion-paused .depth-surface .collection-image{transform:scale(1.04)!important;transition:none}
@media(hover:none),(pointer:coarse){.world-card,.js-motion .world-card.reveal.visible{transform:none;transform-style:flat}.world-card .world-label,.world-card .world-no{transform:none}.depth-glint{display:none}.world-card:hover .collection-image{transform:scale(1.04)}}
@media(prefers-reduced-motion:reduce){body:not(.motion-enabled) .world-card{transform:none!important}body:not(.motion-enabled) .world-label,body:not(.motion-enabled) .world-no{transform:none}}

/* The product photograph gently moves as a framed object on all screen sizes. */
.product-depth-stage{perspective:1100px;animation:trio-sway 10s ease-in-out infinite;transform-style:preserve-3d;min-width:0}
.product-depth-stage .product-photo{transform:rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .55s ease-out;box-shadow:0 25px 50px #0007,5px 6px 0 #6c4a39,0 0 0 1px #d8b89866}
.product-depth-stage .product-photo.is-tilting{transition:transform .12s linear}
.product-depth-stage .product-photo img{transform:scale(1.04) translate(var(--image-x,0px),var(--image-y,0px));object-position:50% 55%;transition:transform .4s ease-out}
.product-glint{position:absolute;inset:0;background:radial-gradient(circle at var(--light-x,35%) var(--light-y,20%),#fff8e526,transparent 60%);pointer-events:none;z-index:1}
.motion-paused .product-depth-stage{animation:none!important;transform:none!important}
.motion-paused .product-depth-stage .product-photo{transform:none!important;transition:none}
.motion-paused .product-depth-stage .product-photo img{transform:scale(1.04);transition:none}
@keyframes trio-sway{0%,100%{transform:rotateX(1deg) rotateY(-3deg) translateY(0)}50%{transform:rotateX(-1deg) rotateY(3deg) translateY(-7px)}}
@media(prefers-reduced-motion:reduce){body:not(.motion-enabled) .product-depth-stage{animation:none!important;transform:none}body:not(.motion-enabled) .product-depth-stage .product-photo{transform:none!important}}