/* =========================================================
   Cinematic Gallery
   ========================================================= */
.cine-gallery-wrap{ margin-top:3.5rem; }

.cine-stage{
  position:relative;
  height:clamp(320px, 46vw, 520px);
  overflow:hidden;
  perspective:1400px;
  touch-action:pan-y;
  cursor:grab;
  outline:none;
}
.cine-stage.dragging{ cursor:grabbing; }

.cine-slide{
  position:absolute; top:50%; left:50%;
  width:min(64vw, 620px);
  aspect-ratio:4/3;
  border-radius:12px;
  overflow:hidden;
  will-change:transform, opacity, filter;
  transition:transform .8s cubic-bezier(.22,.61,.36,1),
             opacity .8s cubic-bezier(.22,.61,.36,1),
             filter .8s cubic-bezier(.22,.61,.36,1);
  box-shadow:var(--shadow-soft);
  cursor:pointer;
}
.cine-slide img{
  width:100%; height:100%;
  object-fit:cover;      /* crops to fill — never stretches, any resolution */
  object-position:center;
  display:block;
  transition:transform .5s var(--ease);
}
.cine-slide.is-active:hover img{ transform:scale(1.02); }

.cine-slide::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(var(--rgb-black),.55), transparent 55%);
  opacity:0; transition:opacity .5s var(--ease); pointer-events:none;
}
.cine-slide.is-active::after{ opacity:1; }

.cine-caption{
  position:absolute; left:1.4rem; right:1.4rem; bottom:1.2rem;
  color:var(--color-charcoal); font-family:var(--font-accent); letter-spacing:.04em; font-size:.95rem;
  opacity:0; transform:translateY(10px);
  transition:opacity .5s var(--ease) .15s, transform .5s var(--ease) .15s;
  pointer-events:none;
}
.cine-slide.is-active .cine-caption{ opacity:1; transform:translateY(0); }

.cine-nav{
  display:flex; align-items:center; justify-content:center; gap:2rem; margin-top:1.8rem;
}
.cine-nav button{
  background:none; border:none; cursor:pointer;
  font-family:var(--font-accent); text-transform:uppercase; letter-spacing:.14em; font-size:.78rem;
  color:var(--color-ink); transition:color .3s;
}
.cine-nav button:hover{ color:var(--color-bronze-deep); }
.cine-nav button:disabled{ opacity:.3; cursor:default; }
.cine-counter{
  font-family:var(--font-accent); font-size:.78rem; letter-spacing:.1em; color:var(--color-ink-soft);
}

.cine-progress{
  max-width:300px; margin:1.2rem auto 0; height:1px;
  background:rgba(var(--rgb-track),.25); position:relative;
}
.cine-progress-fill{
  position:absolute; top:0; left:0; height:100%;
  background:var(--color-bronze);
  transition:width .6s cubic-bezier(.22,.61,.36,1);
}

@media (max-width:900px){
  .cine-slide{ width:min(78vw, 520px); }
}
@media (max-width:600px){
  .cine-stage{ height:clamp(260px, 80vw, 380px); }
  .cine-slide{ width:88vw; }
  .cine-caption{ font-size:.85rem; }
}
@media (prefers-reduced-motion: reduce){
  .cine-slide{ transition-duration:.01ms; }
  .cine-slide img{ transition-duration:.01ms; }
}
