/* Carpe diém V12 — cinematic product gallery */
.gallery{position:sticky;top:84px;align-self:start;perspective:1400px}
.gmain{isolation:isolate;touch-action:pan-y;cursor:grab;border:1px solid rgba(198,157,72,.22);box-shadow:0 24px 70px rgba(0,0,0,.22),inset 0 0 0 1px rgba(255,255,255,.035)}
.gmain::before{content:"";position:absolute;inset:-25%;z-index:2;pointer-events:none;background:radial-gradient(circle at var(--gx,50%) var(--gy,35%),rgba(255,224,151,.18),transparent 28%),linear-gradient(115deg,transparent 35%,rgba(255,255,255,.08) 49%,transparent 62%);mix-blend-mode:screen;opacity:.55;transform:translate3d(calc((var(--mx,0) * 1px)),calc((var(--my,0) * 1px)),0);transition:opacity .35s ease}
.gmain::after{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.04),transparent 22%,transparent 72%,rgba(0,0,0,.18));}
.gmain img{z-index:1;will-change:transform,opacity;transition:transform .45s cubic-bezier(.2,.75,.2,1),opacity .3s ease,filter .45s ease}
.gmain.gallery-swap-next img{animation:cdGalleryNext .42s cubic-bezier(.2,.8,.2,1)}
.gmain.gallery-swap-prev img{animation:cdGalleryPrev .42s cubic-bezier(.2,.8,.2,1)}
@keyframes cdGalleryNext{0%{opacity:.25;transform:translateX(8%) scale(1.045)}100%{opacity:1;transform:translateX(0) scale(1)}}
@keyframes cdGalleryPrev{0%{opacity:.25;transform:translateX(-8%) scale(1.045)}100%{opacity:1;transform:translateX(0) scale(1)}}
.gmain.zoom img{transform:scale(2.1)}
.gallery-ui{position:absolute;z-index:8;left:14px;right:14px;top:14px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}
.gcount,.gswipe{backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);background:rgba(10,18,51,.52);border:1px solid rgba(255,255,255,.11);color:#fff;padding:7px 10px;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.gcount b{color:var(--gold);font-weight:500}
.gnav{position:absolute;z-index:9;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 10px;pointer-events:none}
.gnav button{pointer-events:auto;width:42px;height:42px;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(9,16,48,.46);color:#fff;backdrop-filter:blur(10px);font-size:21px;line-height:1;opacity:.75;transition:opacity .2s,transform .2s,border-color .2s}
.gnav button:hover{opacity:1;border-color:var(--gold);transform:scale(1.06)}
.gnav button:disabled{opacity:0;pointer-events:none}
.thumbs{display:flex;gap:10px;margin-top:13px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:2px 2px 8px;scrollbar-width:none}
.thumbs::-webkit-scrollbar{display:none}
.thumbs button{flex:none;width:78px;aspect-ratio:4/5;padding:0;border:1px solid rgba(180,155,110,.22);background:var(--pearl);overflow:hidden;position:relative;scroll-snap-align:start;border-radius:2px;transition:transform .25s,border-color .25s,box-shadow .25s}
.thumbs button:hover{transform:translateY(-3px)}
.thumbs button[aria-pressed="true"]{border-color:var(--gold);box-shadow:0 8px 22px rgba(184,145,64,.18)}
.thumbs button[aria-pressed="true"]::after{content:"";position:absolute;inset:0;border:2px solid rgba(255,220,145,.72);pointer-events:none}
.thumbs img{width:100%;height:100%;object-fit:cover}
.thumbs .t360{display:grid;place-items:center;font-family:var(--display);font-size:18px;color:var(--gold);height:100%;background:linear-gradient(135deg,#070c20,#202b59)}
.gallery-dots{display:flex;justify-content:center;gap:6px;margin-top:4px}
.gallery-dots button{width:5px;height:5px;border:0;border-radius:50%;padding:0;background:var(--line-2);transition:width .25s,background .25s}
.gallery-dots button[aria-current="true"]{width:20px;border-radius:10px;background:var(--gold)}
.gnote{z-index:8;left:14px;bottom:14px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);background:rgba(5,9,26,.68);border:1px solid rgba(255,255,255,.08)}
@media(max-width:860px){
  .gallery{position:static;perspective:none}
  .gmain{cursor:grab;aspect-ratio:4/5}
  .gmain::before{opacity:.35}
  .gnav button{width:38px;height:38px}
  .gswipe{display:block}
  .thumbs button{width:70px}
}
@media(max-width:640px){
  .gallery-ui{left:10px;right:10px;top:10px}
  .gnote{bottom:10px;left:10px;font-size:10px}
  .gnav{padding:0 6px}
}
@media(prefers-reduced-motion:reduce){
  .gmain::before,.gmain img,.gnav button,.thumbs button{transition:none!important}
  .gmain.gallery-swap-next img,.gmain.gallery-swap-prev img{animation:none!important}
}