.ccc-coverflow-wrap{ position:relative; width:100%; }
.ccc-coverflow{ position:relative; width:100%; }
.ccc-coverflow .swiper-wrapper{ align-items:center; }
.ccc-slide{ display:flex; align-items:center; justify-content:center; }
.ccc-figure{ position:relative; margin:0; }
.ccc-slide img{ display:block; width:auto; max-width:260px; height:auto; }
.ccc-caption{ position:absolute; left:0; right:0; bottom:-48px; text-align:center; }
.ccc-caption h4{ margin:6px 0 2px; font-size:16px; line-height:1.2; }
.ccc-caption p{ margin:0; font-size:13px; opacity:.85; }
.ccc-button-prev,.ccc-button-next{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:36px;
  height:36px;
  /*border-radius:50%;*/
  /*background:#7ACD10;*/
  color:#fff;
  display:flex; align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:5;
  /*box-shadow:0 6px 14px rgba(122,205,16,.35);*/
}
.ccc-button-prev{ left:-18px; }
.ccc-button-next{ right:-18px; }

/* cuando las flechas están fuera, ampliar el área sin superponer imagen */
.ccc-coverflow-wrap .ccc-button-prev{ left:-24px; }
.ccc-coverflow-wrap .ccc-button-next{ right:-24px; }
/*.ccc-button-prev::before,.ccc-button-next::before{*/
/*  content:''; display:block; width:10px; height:10px; border-right:2px solid #fff; border-bottom:2px solid #fff;*/
/*}*/
.ccc-button-prev::before{ transform:rotate(135deg); }
.ccc-button-next::before{ transform:rotate(-45deg); }

.ccc-pagination{ position:relative; margin-top:20px; text-align:center; }

/* ===== Mobile: mostrar solo 3 (prev, active, next) y condensar laterales ===== */
@media (max-width: 767px){
  /* ocupar el ancho máximo en móvil */
  .ccc-coverflow .swiper-slide{ width:auto; }
  .ccc-coverflow .ccc-slide img{ width:100%; max-width:100%; height:auto; }
  .ccc-coverflow .swiper-slide{ opacity:0; pointer-events:none; transition:opacity .3s ease; }
  .ccc-coverflow .swiper-slide-prev,
  .ccc-coverflow .swiper-slide-next,
  .ccc-coverflow .swiper-slide-active{ opacity:1; pointer-events:auto; }

  /* Escalado suave: laterales más pequeñas, central ampliada */
  .ccc-slide .ccc-figure{ transition:transform .3s ease, opacity .3s ease; transform-origin:center center; }
  .ccc-coverflow .swiper-slide-prev .ccc-figure,
  .ccc-coverflow .swiper-slide-next .ccc-figure{ transform:scale(.68); opacity:.88; }
  .ccc-coverflow .swiper-slide-active .ccc-figure{ transform:scale(1.12); opacity:1; }

  /* Priorizar la central por encima de laterales */
  .ccc-coverflow .swiper-slide-active{ z-index:2; }
}