.wccs-wrap{
  font-family:var(--wccs-font-family),sans-serif;
  --wccs-card-bg:#fff;
  --wccs-card-border:#e7e7e7;
  --wccs-card-hover-bg:#fff;
  --wccs-card-hover-border:#15452c;
  --wccs-text:#222;
  --wccs-arrow-bg:#15452c;
  --wccs-arrow-color:#fff;
  --wccs-section-bg:#fff;
  --wccs-title-color:#111;
  --wccs-title-size:26px;
  --wccs-font-family:'Hind Siliguri',sans-serif;
  --wccs-heading-font-family:'Roboto',sans-serif;
  --wccs-padding-top:28px;
  --wccs-padding-bottom:28px;
  --wccs-gap:20px;
  width:100%;
  box-sizing:border-box;
  font-family:var(--wccs-font-family),sans-serif;
  background:var(--wccs-section-bg);
  position:relative;
  overflow:hidden;
  border-radius:12px;
  padding:var(--wccs-padding-top) 0 var(--wccs-padding-bottom);
}
.wccs-wrap *{box-sizing:border-box}
.wccs-heading{
  font-family:var(--wccs-heading-font-family),sans-serif;
  font-family:var(--wccs-font-family),sans-serif;
  margin:0 0 32px;
  padding:0 14px;
  color:var(--wccs-title-color);
  font-size:var(--wccs-title-size);
  line-height:1.2;
  font-weight:600;
  text-align:center;
  letter-spacing:-.2px;
}
.wccs-viewport{
  position:relative;
  width:100%;
  padding:0 43px;
}
.wccs-track{
  display:flex;
  gap:var(--wccs-gap);
  overflow-x:auto;
  overflow-y:hidden;
  scroll-behavior:smooth;
  scrollbar-width:none;
  -ms-overflow-style:none;
  padding:2px 0 4px;
  overscroll-behavior-x:contain;
}
.wccs-track::-webkit-scrollbar{display:none}
.wccs-card{
  flex:0 0 calc((100% - (5 * var(--wccs-gap))) / 6);
  min-width:0;
  text-decoration:none !important;
  color:var(--wccs-text) !important;
  background:var(--wccs-card-bg);
  border:1px solid var(--wccs-card-border);
  border-radius:11px;
  overflow:hidden;
  padding:11px 11px 0;
  box-shadow:0 2px 7px rgba(0,0,0,.10);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background-color .22s ease;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.wccs-card:hover{
  background:var(--wccs-card-hover-bg);
  border-color:var(--wccs-card-hover-border);
  transform:translateY(-2px);
  box-shadow:0 6px 18px rgba(0,0,0,.13);
}
.wccs-image-wrap{
  width:100%;
  aspect-ratio:1 / 1;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#fff;
  border-radius:9px;
}
.wccs-image-wrap img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .25s ease;
}
.wccs-card:hover .wccs-image-wrap img{transform:scale(1.025)}
.wccs-title{
  font-family:var(--wccs-font-family),sans-serif;
  font-family:var(--wccs-font-family),sans-serif;
  width:100%;
  min-height:39px;
  padding:10px 3px 9px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  font-size:15px;
  line-height:1.25;
  font-weight:600;
  color:var(--wccs-text);
  word-break:break-word;
}
.wccs-arrow{
  position:absolute;
  z-index:5;
  top:50%;
  transform:translateY(-50%);
  width:38px;
  height:38px;
  border:0;
  border-radius:50%;
  background:var(--wccs-arrow-bg);
  color:var(--wccs-arrow-color);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  cursor:pointer;
  box-shadow:0 2px 9px rgba(0,0,0,.14);
  transition:opacity .2s ease,transform .2s ease,filter .2s ease;
}
.wccs-arrow:hover{
  filter:brightness(.92);
  transform:translateY(-50%) scale(1.05);
}
.wccs-arrow span{
  font-size:31px;
  line-height:1;
  font-family:Arial,sans-serif;
  font-weight:300;
  margin-top:-3px;
}
.wccs-prev{left:10px}
.wccs-next{right:10px}
.wccs-arrow[disabled]{opacity:.35;cursor:default;pointer-events:none}
@media (min-width:1025px){
  .wccs-card{flex-basis:calc((100% - (7 * var(--wccs-gap))) / 8)}
}
@media (max-width:1024px){
  .wccs-viewport{padding:0 38px}
  .wccs-card{flex-basis:calc((100% - (5 * var(--wccs-gap))) / 6)}
}
@media (max-width:767px){
  .wccs-wrap{border-radius:9px;--wccs-gap:10px}
  .wccs-heading{margin-bottom:20px;font-size:min(var(--wccs-title-size),22px)}
  .wccs-viewport{padding:0}
  .wccs-card{flex-basis:calc((100% - (2 * var(--wccs-gap))) / 3);padding:6px 6px 0;border-radius:8px}
  .wccs-title{font-size:12.5px;min-height:37px;padding:7px 2px 8px}
  .wccs-arrow{width:32px;height:32px}
  .wccs-arrow span{font-size:28px}
  .wccs-prev{left:0}.wccs-next{right:0}
}
