/* GAMA · Carrusel de casos de éxito (#casos)
   Reutiliza el lenguaje visual de .card.gama-photo-card. Sin dependencias. */

.cs-wrap{margin-top:44px;position:relative}

.cs-viewport{
  overflow-x:auto;overflow-y:hidden;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  padding:6px 2px 14px;
  margin:-6px -2px 0;
}
.cs-viewport::-webkit-scrollbar{display:none}
.cs-viewport.cs-dragging{scroll-behavior:auto;cursor:grabbing;scroll-snap-type:none}
.cs-viewport.cs-dragging .cs-card{pointer-events:none}

.cs-track{display:flex;gap:24px;align-items:stretch}

.cs-card{
  flex:0 0 calc((100% - 48px)/3);
  scroll-snap-align:start;
  display:flex;flex-direction:column;
  min-height:360px;
  margin:0;
}
.cs-card h3{margin-top:18px}
.cs-card p{margin:0}
.cs-card .cs-desc{margin-top:10px;flex:1 1 auto}
.cs-card .cs-impact{
  font-size:12.5px;color:var(--mint);margin-top:18px;
  padding-top:16px;border-top:1px solid var(--ink700);
  letter-spacing:.04em;
}

/* controles */
.cs-ctrl{display:flex;align-items:center;gap:16px;margin-top:22px}
.cs-btn{
  width:44px;height:44px;flex:0 0 44px;border-radius:99px;
  display:grid;place-items:center;cursor:pointer;
  background:rgba(255,255,255,.04);
  border:1px solid var(--ink700);
  color:var(--ink100);
  transition:transform .2s cubic-bezier(.23,1,.32,1),background .2s,border-color .2s,opacity .2s;
}
.cs-btn:hover{background:rgba(128,53,138,.22);border-color:var(--purple,#80358A);transform:translateY(-2px)}
.cs-btn:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.cs-btn svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.cs-btn[disabled]{opacity:.32;cursor:default;transform:none}

.cs-dots{display:flex;gap:8px;flex-wrap:wrap;margin-left:4px}
.cs-dots button{
  width:22px;height:6px;border-radius:99px;border:0;padding:0;cursor:pointer;
  background:var(--ink600,#252B37);transition:background .25s,width .25s;
}
.cs-dots button[aria-current="true"]{background:var(--mint);width:34px}
.cs-dots button:focus-visible{outline:2px solid var(--mint);outline-offset:3px}

.cs-count{margin-left:auto;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink300,#8B93A5)}

/* barra de progreso (solo móvil) */
.cs-progress{display:none;flex:1 1 auto;height:4px;border-radius:99px;background:var(--ink600,#252B37);overflow:hidden}
.cs-progress i{display:block;height:100%;width:10%;border-radius:99px;background:var(--mint);transition:width .25s ease-out}
.cs-status{display:none;font-size:12px;letter-spacing:.14em;color:var(--ink300,#8B93A5);flex:0 0 auto}

.cs-viewport:focus-visible{outline:2px solid var(--mint);outline-offset:4px;border-radius:18px}

/* tablet */
@media (max-width:1024px){
  .cs-card{flex:0 0 calc((100% - 24px)/2);min-height:340px}
}
/* mobile: 1 tarjeta + insinuación de la siguiente */
@media (max-width:680px){
  .cs-track{gap:16px}
  .cs-card{flex:0 0 86%;min-height:320px}
  .cs-count{display:none}
  .cs-dots{display:none}
  .cs-progress{display:block}
  .cs-status{display:block}
  .cs-ctrl{gap:12px;flex-wrap:nowrap;margin-top:18px}
  .cs-btn{width:48px;height:48px;flex:0 0 48px}
}


@media (prefers-reduced-motion:reduce){
  .cs-viewport{scroll-behavior:auto}
  .cs-btn:hover{transform:none}
}
