/* Carrusel de Categorías — 1.2.0. Clases exclusivas para evitar conflictos con themes. */
.cccc {
  --cccc-visible:3;
  --cccc-gap:16px;
  --cccc-hover-lift:3px;
  --cccc-arrow-width:32px;
  --cccc-arrow-height:40px;
  --cccc-arrow-font:32px;
  --cccc-arrow-radius:40px;
  --cccc-arrow-offset-x:10px;
  --cccc-arrow-offset-y:0px;
  --cccc-dots-bottom:1px;
  position:relative;
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
  padding:12px 16px 18px;
  background:#050505;
  border-radius:26px;
}
.cccc.cccc--transparent {background-color:transparent !important;}
.cccc *, .cccc *::before, .cccc *::after {box-sizing:border-box;}
.cccc-track {
  display:flex;
  flex-wrap:nowrap;
  align-items:stretch;
  gap:var(--cccc-gap);
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  min-width:0;
  padding:5px 2px 12px;
  touch-action:pan-x pan-y;
}
.cccc-track::-webkit-scrollbar {display:none;}
.cccc-track:focus-visible {outline:2px solid #12dce5;outline-offset:2px;}
.cccc-track.cccc-is-dragging {scroll-snap-type:none;scroll-behavior:auto;cursor:grabbing;user-select:none;}
.cccc--mouse-drag .cccc-track {cursor:grab;}
.cccc--mouse-drag .cccc-track a {user-select:none;}
.cccc-card {
  flex:0 0 calc((100% - (var(--cccc-visible) - 1) * var(--cccc-gap)) / var(--cccc-visible));
  min-width:0;
  scroll-snap-align:start;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:11px;
  border-radius:21px;
  background:#f3f3f3;
  box-shadow:0 3px 10px #0002;
}
.cccc-image {
  position:relative;
  display:block;
  overflow:hidden;
  height:175px;
  background:#25303f;
  border-radius:15px;
  text-decoration:none;
}
.cccc-image img, .cccc-placeholder {
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
.cccc-image::after {
  content:"";
  pointer-events:none;
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.4);
  transition:background-color .2s ease;
}
.cccc-title {
  position:absolute;
  z-index:1;
  inset:0;
  display:flex;
  justify-content:center;
  align-items:center;
  text-align:center;
  padding:10px;
  color:#fff;
  font:600 17px/1.25 Poppins,Arial,sans-serif;
}
.cccc-button {
  display:flex;
  gap:4px;
  align-items:center;
  justify-content:center;
  min-height:28px;
  border-radius:50px;
  box-shadow:0 2px 8px #0003;
  background:#fafafa;
  color:#080808;
  text-decoration:none;
  text-align:center;
  font:600 12px/1.2 Poppins,Arial,sans-serif;
  transition:background-color .2s ease,color .2s ease,box-shadow .2s ease;
}
.cccc-button span {color:#005bff;}
.cccc-button:hover {background:#e8f6ff;color:#080808;box-shadow:0 3px 9px #0004;}
.cccc-image:focus-visible,.cccc-button:focus-visible,.cccc-controls button:focus-visible {
  outline:2px solid #12dce5;
  outline-offset:2px;
}
.cccc-controls {
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  margin:2px auto 0;
  min-height:15px;
}
.cccc-controls[hidden] {display:none !important;}
.cccc button.cccc-arrow {
  display:grid;
  place-items:center;
  position:relative;
  flex:0 0 auto;
  padding:0;
  margin:0;
  width:var(--cccc-arrow-width);
  height:var(--cccc-arrow-height);
  border:0;
  border-radius:var(--cccc-arrow-radius);
  background-color:transparent;
  box-shadow:none;
  font:400 var(--cccc-arrow-font)/1 Arial,sans-serif;
  color:#fff;
  cursor:pointer;
  transition:background-color .2s,color .2s,opacity .2s;
}
.cccc button.cccc-arrow:hover {box-shadow:none;}
.cccc button.cccc-arrow:disabled {opacity:.3;cursor:default;}
.cccc-dots {display:flex;justify-content:center;align-items:center;gap:6px;}
/* Visual dots are customizable, while their transparent hit-area remains touch friendly. */
.cccc button.cccc-dot {
  --cccc-dot-size:8px;
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  width:max(28px,var(--cccc-dot-size));
  height:max(28px,var(--cccc-dot-size));
  padding:0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  cursor:pointer;
}
.cccc button.cccc-dot::before {
  content:"";
  display:block;
  width:var(--cccc-dot-size);
  height:var(--cccc-dot-size);
  border-radius:var(--cccc-dot-radius,50%);
  background:#777;
  transition:background-color .2s;
}
.cccc button.cccc-dot[aria-current="true"]::before {background:#45e3e9;}
.cccc button.cccc-dot:focus-visible {outline:2px solid #12dce5;outline-offset:0;}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .cccc--hover-soft .cccc-card {transition:transform .3s ease,box-shadow .3s ease,background-color .2s ease;}
  .cccc--hover-soft .cccc-card:hover {transform:translateY(calc(-1 * var(--cccc-hover-lift)));box-shadow:0 9px 20px #0003;}
  .cccc--hover-soft .cccc-card:focus-within {box-shadow:0 9px 20px #0003;}
}
@media (min-width:1025px) {
  .cccc-controls {position:absolute;inset:0;pointer-events:none;display:block;margin:0;min-height:0;}
  .cccc button.cccc-arrow {position:absolute;top:calc(50% + var(--cccc-arrow-offset-y));transform:translateY(-50%);pointer-events:auto;z-index:2;}
  .cccc button.cccc-prev {left:calc(-1 * var(--cccc-arrow-offset-x));}
  .cccc button.cccc-next {right:calc(-1 * var(--cccc-arrow-offset-x));}
  .cccc-dots {position:absolute;left:0;right:0;bottom:var(--cccc-dots-bottom);pointer-events:auto;}
  .cccc [data-hidden-desktop="1"] {display:none !important;}
}
@media (min-width:768px) and (max-width:1024px) {
  .cccc {--cccc-visible:2;}
  .cccc-controls {position:relative;justify-content:center;align-items:center;min-height:30px;gap:13px;}
  .cccc [data-hidden-tablet="1"] {display:none !important;}
}
@media (max-width:767px) {
  .cccc {--cccc-visible:1;padding:11px 12px 15px;}
  .cccc-image {height:150px;}
  .cccc-card {padding:11px;gap:10px;}
  .cccc-controls {position:relative;display:flex;justify-content:center;align-items:center;min-height:34px;gap:16px;width:100%;margin:8px auto 0;padding:0;}
  .cccc [data-hidden-mobile="1"] {display:none !important;}
}
@media (prefers-reduced-motion:reduce) {
  .cccc-track {scroll-behavior:auto;}
  .cccc-card,.cccc-button,.cccc-image::after,.cccc button.cccc-arrow,.cccc button.cccc-dot::before {transition:none !important;}
}

/* Clones carry no tab stops or screen-reader duplication. Their cached URLs/images remain clickable with the mouse. */
.cccc-card[data-cccc-clone] {scroll-snap-align:start;}