/* Animaciones al hacer scroll en /sociales/. Solo se ocultan elementos cuando el script está activo (.sm-ready). */
.sm-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 200;
  height: 3px;
  background: linear-gradient(90deg, #f08a4d, #d9531c 55%, #9b5bb5);
  transform: scaleX(var(--sm-progress, 0));
  transform-origin: left;
  pointer-events: none;
}

/* Títulos palabra por palabra */
.sm-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.sm-w > span { display: inline-block; }
.sm-ready .sm-words .sm-w > span {
  transform: translateY(108%) rotate(5deg);
  transition: transform .95s cubic-bezier(.2, .8, .2, 1);
  transition-delay: calc(var(--i, 0) * 60ms);
}
.sm-ready .sm-words.is-in .sm-w > span { transform: none; }

/* Textos que suben */
.sm-ready .sm-up {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .75s ease, transform .85s cubic-bezier(.2, .75, .2, 1);
  transition-delay: calc(var(--sm-i, 0) * 70ms);
}
.sm-ready .sm-up.is-in { opacity: 1; transform: none; }

/* Tarjetas en cascada */
.sm-ready .sm-card {
  opacity: 0;
  transform: translateY(46px) scale(.965);
  transition: opacity .8s ease, transform 1s cubic-bezier(.2, .75, .2, 1);
  transition-delay: calc(var(--sm-i, 0) * 110ms);
}
.sm-ready .sm-card.is-in { opacity: 1; transform: none; }

/* Fotos: se abren como un telón y hacen un leve zoom */
.sm-ready .sm-img {
  clip-path: inset(14% 10% 14% 10%);
  transition: clip-path 1.2s cubic-bezier(.7, 0, .2, 1);
}
.sm-ready .sm-img.is-in { clip-path: inset(0 0 0 0); }
.sm-ready .sm-img img { transform: scale(1.18) translateY(var(--sm-par, 0px)); transition: transform 1.6s cubic-bezier(.2, .7, .2, 1); }
.sm-ready .sm-img.is-in img { transform: scale(1.06) translateY(var(--sm-par, 0px)); transition: transform .2s linear; }
.sm-ready .sm-img.is-in.sm-settling img { transition: transform 1.6s cubic-bezier(.2, .7, .2, 1); }

/* Etiquetas y botones que aparecen con rebote */
.sm-ready .sm-pop {
  opacity: 0;
  transform: scale(.7);
  transition: opacity .5s ease, transform .6s cubic-bezier(.2, 1.4, .35, 1);
  transition-delay: calc(.2s + var(--sm-i, 0) * 80ms);
}
.sm-ready .sm-pop.is-in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .sm-progress { display: none; }
}