/* ===== Animación solo para tarjetas de la sección Servicios ===== */
.section-services .card {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.6s ease both;  /* both = aplica antes y después */
  will-change: transform, opacity;
}

/* Stagger (retardo progresivo) */
.section-services .card:nth-child(1) { animation-delay: 0.10s; }
.section-services .card:nth-child(2) { animation-delay: 0.20s; }
.section-services .card:nth-child(3) { animation-delay: 0.30s; }
.section-services .card:nth-child(4) { animation-delay: 0.40s; }
.section-services .card:nth-child(5) { animation-delay: 0.50s; }
.section-services .card:nth-child(6) { animation-delay: 0.60s; }

/* Hover (solo desktop) */
@media (hover:hover) {
  .section-services .card {
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
  }
  .section-services .card:hover {
    transform: translateY(-8px);
    border-color: var(--brand, #06b6d4);
    box-shadow: 0 12px 22px rgba(0,0,0,.15), 0 0 10px rgba(254,212,3,.35);
  }
}

/* Foco accesible (teclado) */
.section-services .card:focus-within {
  transform: translateY(-6px);
  border-color: var(--brand, #06b6d4);
  outline: 2px solid rgba(6,182,212,.45);
  outline-offset: 2px;
  box-shadow: 0 10px 20px rgba(0,0,0,.14), 0 0 10px rgba(6,182,212,.24);
}


/* ===== Animación solo para tarjetas de la sección Casos ===== */
.section-casos .cs-case {
  opacity: 0;
  transform: translateY(24px);
  animation: fadeUp 0.7s ease both;
  will-change: transform, opacity;
}

/* Stagger (retardo progresivo en cards de casos) */
.section-casos .cs-case:nth-child(1) { animation-delay: 0.10s; }
.section-casos .cs-case:nth-child(2) { animation-delay: 0.20s; }
.section-casos .cs-case:nth-child(3) { animation-delay: 0.30s; }
.section-casos .cs-case:nth-child(4) { animation-delay: 0.40s; }
.section-casos .cs-case:nth-child(5) { animation-delay: 0.50s; }

/* Animación para testimonios */
.section-casos .cs-testi {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.7s ease both;
  will-change: transform, opacity;
}
.section-casos .cs-testi:nth-child(1) { animation-delay: 0.60s; }
.section-casos .cs-testi:nth-child(2) { animation-delay: 0.70s; }
.section-casos .cs-testi:nth-child(3) { animation-delay: 0.80s; }

/* Hover (solo desktop, casos) */
@media (hover:hover) {
  .section-casos .cs-case {
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  }
  .section-casos .cs-case:hover {
    transform: translateY(-8px);
    border-color: var(--brand, #06b6d4);
    box-shadow: 0 14px 26px rgba(2,6,23,.14), 0 0 12px rgba(6,182,212,.28);
  }

  .section-casos .cs-testi {
    transition: transform .28s ease, box-shadow .28s ease, border-color .28s ease;
  }
  .section-casos .cs-testi:hover {
    transform: translateY(-6px);
    border-color: var(--brand, #06b6d4);
    box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 0 8px rgba(6,182,212,.25);
  }
}

/* Foco accesible (teclado) */
.section-casos .cs-case:focus-within,
.section-casos .cs-testi:focus-within {
  transform: translateY(-6px);
  border-color: var(--brand, #06b6d4);
  outline: 2px solid rgba(6,182,212,.45);
  outline-offset: 2px;
  box-shadow: 0 12px 22px rgba(2,6,23,.14), 0 0 10px rgba(6,182,212,.24);
}

/* Respetar usuarios con “reducir movimiento” */
@media (prefers-reduced-motion: reduce) {
  .section-services .card,
  .section-casos .cs-case,
  .section-casos .cs-testi {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}

/* Keyframes reutilizables (una sola vez en el archivo) */
@keyframes fadeUp {
  to { opacity: 1; transform: translateY(0); }
}