/* Klixy College Gallery — auto-sliding carousel, front-end styles */

.kcg-slider{
  position:relative;
  margin-top:24px;
  border-radius:20px;
  overflow:hidden;
  background:#EEEEF5;
}

.kcg-track{
  display:flex;
  transition:transform .5s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}

.kcg-slide{
  position:relative;
  flex:0 0 100%;
  width:100%;
  aspect-ratio:16/9;
  background:#E4E3EA;
}

.kcg-media{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border:0;
}

.kcg-noimg{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#777780;
  font-size:.9rem;
}

.kcg-caption{
  position:absolute;
  left:0; right:0; bottom:0;
  margin:0;
  padding:14px 20px;
  font-size:.9rem;
  color:#fff;
  background:linear-gradient(to top, rgba(0,0,0,.65), rgba(0,0,0,0));
  pointer-events:none;
}

.kcg-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:2;
  width:40px;
  height:40px;
  border-radius:50%;
  border:none;
  background:rgba(255,255,255,.85);
  color:#1B1B23;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.15);
  font-size:16px;
  line-height:1;
  transition:background .2s ease;
}

.kcg-arrow:hover{ background:#fff; }
.kcg-prev{ left:14px; }
.kcg-next{ right:14px; }

.kcg-dots{
  position:absolute;
  left:0; right:0; bottom:12px;
  display:flex;
  justify-content:center;
  gap:8px;
  z-index:2;
}

.kcg-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  border:none;
  background:rgba(255,255,255,.55);
  cursor:pointer;
  padding:0;
  transition:background .2s ease, transform .2s ease;
}

.kcg-dot.active{
  background:#fff;
  transform:scale(1.25);
}

@media (max-width:640px){
  .kcg-arrow{ width:32px; height:32px; font-size:13px; }
  .kcg-caption{ font-size:.8rem; padding:10px 14px; }
}