/* Circular 3D photo gallery — desktop "watch video" replacement.
   Reuses .video-modal-overlay (backdrop fade) and .video-modal-close
   from index-video-modal.css; this file styles the gallery content only. */

.gallery-modal-content{
  position:relative;
  width:min(94vw,1200px);
  height:min(86vh,640px);
  transform:scale(.92);
  transition:transform .25s cubic-bezier(.16,1,.3,1);
}
.video-modal-overlay.is-open .gallery-modal-content{transform:scale(1)}

.circular-gallery{
  position:relative;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  perspective:1800px;
  touch-action:pan-y;
  cursor:grab;
}
.circular-gallery.dragging{cursor:grabbing}

.circular-gallery-track{
  position:relative;
  width:100%;
  height:100%;
  transform-style:preserve-3d;
  will-change:transform;
}

.circular-gallery-item{
  position:absolute;
  left:50%;
  top:50%;
  width:280px;
  height:380px;
  margin:-190px 0 0 -140px;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,0.25);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.25),
    0 24px 60px rgba(74,26,122,0.45),
    0 4px 16px rgba(0,0,0,0.25);
  background:
    linear-gradient(135deg, rgba(74,26,122,0.25) 0%, rgba(123,82,171,0.12) 100%),
    rgba(255,255,255,0.08);
  backdrop-filter:blur(20px) saturate(180%);
  -webkit-backdrop-filter:blur(20px) saturate(180%);
  transition:opacity .3s linear;
}

.circular-gallery-item img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  padding:18px;
  box-sizing:border-box;
}

.circular-gallery-item--video{cursor:pointer}

.circular-gallery-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.circular-gallery-play{
  position:absolute;
  top:50%; left:50%;
  width:64px; height:64px;
  margin:-32px 0 0 -32px;
  border-radius:50%;
  background:rgba(74,26,122,0.65);
  color:#ffffff;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  box-shadow:0 4px 16px rgba(0,0,0,0.35);
  transition:opacity .2s linear, transform .2s ease;
}

.circular-gallery-item--video.is-playing .circular-gallery-play{
  opacity:0;
  transform:scale(0.8);
}

.circular-gallery-caption{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:14px 16px;
  background:linear-gradient(to top, rgba(74,26,122,0.85), transparent);
  color:#ffffff;
  font-family:'Quicksand', sans-serif;
  font-weight:700;
  font-size:0.95rem;
  text-align:center;
}

.circular-gallery-hint{
  position:absolute;
  left:50%; bottom:-34px;
  transform:translateX(-50%);
  color:rgba(255,255,255,0.7);
  font-family:'Quicksand', sans-serif;
  font-size:0.8rem;
  white-space:nowrap;
}

@media (prefers-reduced-motion:reduce){
  .circular-gallery-item{transition:none}
}

@media (max-width:880px){
  .gallery-modal-content{width:92vw;height:78vh}
  .circular-gallery-item{width:220px;height:300px;margin:-150px 0 0 -110px}
  .circular-gallery-play{width:48px;height:48px;margin:-24px 0 0 -24px}
}