/* Citil Team Slider v1.4 */
.cts-section{padding:72px 0 84px !important;background:#fff !important;position:relative;overflow:hidden}
.cts-header{max-width:1320px;margin:0 auto 48px !important;padding:0 48px !important;display:flex !important;align-items:flex-end !important;justify-content:space-between !important}
.cts-title{font-size:clamp(28px,3.5vw,40px) !important;font-weight:700 !important;line-height:1.2 !important;color:#1a1a2e !important}
.cts-sub{font-size:15px !important;font-weight:400 !important;color:#888 !important;margin-top:8px !important}

/* Navigation buttons — VERY visible */
.cts-nav{display:flex !important;gap:8px !important;flex-shrink:0 !important}
.cts-btn{
  width:48px !important;height:48px !important;
  min-width:48px !important;min-height:48px !important;
  border:2px solid #1a1a2e !important;
  background:#fff !important;
  color:#1a1a2e !important;
  cursor:pointer !important;
  display:flex !important;align-items:center !important;justify-content:center !important;
  transition:all .25s ease !important;
  border-radius:8px !important;
  font-size:28px !important;
  line-height:1 !important;
  padding:0 !important;
  opacity:1 !important;
  visibility:visible !important;
}
.cts-btn:hover{background:#1a1a2e !important;color:#fff !important}

.cts-viewport{max-width:1320px !important;margin:0 auto !important;overflow:hidden !important;padding:0 48px !important}
.cts-track{display:flex !important;gap:24px !important;transition:transform .5s cubic-bezier(.25,.46,.45,.94) !important;will-change:transform;cursor:grab !important;-webkit-user-select:none;user-select:none}
.cts-track:active{cursor:grabbing !important}
.cts-card{flex:0 0 200px !important;transition:transform .35s ease !important}
.cts-card:hover{transform:translateY(-5px) !important}

.cts-photo{
  width:200px !important;height:258px !important;overflow:hidden !important;
  margin-bottom:14px !important;border-radius:12px !important;background:#f0f0f0 !important;
}
.cts-photo img{
  width:100% !important;height:100% !important;
  object-fit:cover !important;
  /* NO object-position here — controlled by inline style per member */
  filter:grayscale(100%) !important;
  transition:filter .45s ease,transform .5s ease !important;
}
.cts-card:hover .cts-photo img{filter:grayscale(20%) !important;transform:scale(1.04) !important}

.cts-name{font-size:15px !important;font-weight:700 !important;color:#1a1a2e !important;margin-bottom:2px !important;padding:0 2px;line-height:1.3 !important}
.cts-role{font-size:13px !important;font-weight:400 !important;color:#888 !important;line-height:1.4 !important;padding:0 2px;margin:0 !important}
.cts-clevel{font-size:12px !important;font-weight:700 !important;color:#555 !important;letter-spacing:1px !important;padding:0 2px;margin:1px 0 0 !important;display:block !important;line-height:1.3 !important}

.cts-progress{max-width:1320px;margin:36px auto 0 !important;padding:0 48px !important}
.cts-bar{height:2px !important;background:#f0f0f0 !important;position:relative;border-radius:1px}
.cts-fill{height:100% !important;background:var(--cts-accent,#1a1a2e) !important;transition:width .5s ease !important;position:absolute;top:0;left:0;border-radius:1px}

@media(max-width:768px){
  .cts-section{padding:48px 0 60px !important}
  .cts-header{padding:0 20px !important;flex-direction:column !important;align-items:flex-start !important;gap:16px !important;margin-bottom:36px !important}
  .cts-viewport{padding:0 20px !important}
  .cts-track{gap:16px !important}
  .cts-card{flex:0 0 170px !important}
  .cts-photo{width:170px !important;height:220px !important}
  .cts-progress{padding:0 20px !important;margin-top:28px !important}
  .cts-btn{width:44px !important;height:44px !important;min-width:44px !important;font-size:24px !important}
}