.kamar-cc{position:relative;width:var(--cc-w,80%);margin:0 auto;
padding:var(--cc-pad-top) clamp(26px,3vw,44px) 14px;
--cc-pad-top:12px;
--cc-vis:3;--cc-gap:12px;
--cc-img:96px;--cc-pad-y:6px}
.kamar-cc-track{display:flex;gap:var(--cc-gap);list-style:none;margin:0;padding:var(--cc-pad-y) 2px;
overflow-x:auto;scroll-behavior:smooth;
scrollbar-width:none;-ms-overflow-style:none}
.kamar-cc-track::-webkit-scrollbar{display:none}
.kamar-cc-item{flex:0 0 calc((100% - (var(--cc-vis) - 1) * var(--cc-gap)) / var(--cc-vis));
list-style:none;min-width:0}
.kamar-cc-item a{display:flex;flex-direction:column;align-items:center;gap:7px;text-decoration:none}
@supports not (aspect-ratio: 1 / 1) {
.kamar-cc-img{position:relative;height:0;padding-top:min(100%,var(--cc-img,96px))}
.kamar-cc-img img{position:absolute;top:0;left:0;right:0;bottom:0}
}
.kamar-cc-img{display:block;width:100%;max-width:var(--cc-img,96px);aspect-ratio:1;border-radius:50%;overflow:hidden;
background:#fff;border:1px solid #e7ecf2;box-shadow:0 2px 10px rgba(16,53,71,.08);
transition:transform .16s ease,box-shadow .16s ease}
.kamar-cc-item a:hover .kamar-cc-img{transform:translateY(-3px);box-shadow:0 8px 20px rgba(16,53,71,.18)}
.kamar-cc-item a:focus-visible{outline:none}
.kamar-cc-item a:focus-visible .kamar-cc-img{box-shadow:0 0 0 2px #fff,0 0 0 4px #103547}
.kamar-cc-img img{width:100%;height:100%;object-fit:contain;object-position:center;
display:block;background:#fff}
.kamar-cc-name{font-size:clamp(10px,.95vw,12.5px);font-weight:700;color:#103547;text-align:center;
line-height:1.2;width:100%;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kamar-cc-nav{position:absolute;top:calc(var(--cc-pad-top) + var(--cc-pad-y) + var(--cc-img) / 2);transform:translateY(-50%);z-index:3;cursor:pointer;
width:34px;height:44px;border:0!important;border-radius:10px;
background:transparent!important;color:#103547!important;
font-size:0;line-height:0;display:flex;align-items:center;justify-content:center;padding:0!important;
box-shadow:none!important;transition:background .15s ease}
.kamar-cc-nav svg{width:18px;height:18px;display:block}
.kamar-cc-nav svg path{fill:none;stroke:currentColor;stroke-width:2.2;
stroke-linecap:round;stroke-linejoin:round}
.kamar-cc-nav:hover{background:#f4f7ff!important}
.kamar-cc-nav:active{background:#F6B767!important;color:#103547!important;outline:none}
.kamar-cc-nav:focus{outline:none}
.kamar-cc-nav:focus-visible{background:#F6B767!important;color:#103547!important;
outline:2px solid #103547;outline-offset:2px}
.kamar-cc-nav--prev{left:0}
.kamar-cc-nav--next{right:0}
.kamar-cc-nav[hidden]{display:none!important}
@media (min-width:600px) and (max-width:991px){
.kamar-cc{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
overflow-x:clip;padding:var(--cc-pad-top) 30px 14px;--cc-vis:6}
}
@media (min-width:992px){ .kamar-cc{--cc-vis:9;--cc-gap:14px} }
@media (max-width:599px){
.kamar-cc{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
overflow-x:clip;padding:var(--cc-pad-top) 20px 16px;
--cc-pad-top:0px;--cc-vis:3;--cc-gap:10px;--cc-img:78px}
.kamar-cc-track{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%);
mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 96%,transparent 100%)}
.kamar-cc-item{flex:0 0 calc((100vw - 40px - 2 * 10px) / 3)}
.kamar-cc-nav{width:26px;height:36px}
.kamar-cc-nav svg{width:15px;height:15px}
}
@media (prefers-reduced-motion:reduce){ .kamar-cc-track{scroll-behavior:auto} }