.transition-text {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.transition-text.in-view {
  opacity: 1;
  transform: translateY(0);
}

.transition-caption {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.transition-caption.in-view {
  opacity: 1;
  transform: translateY(0);
}


/* Style 1: Fade-up */
.anim-style1 { opacity:0; transform:translateY(20px); transition:all 0.6s ease; }
.anim-style1.in-view { opacity:1; transform:translateY(0); }

/* Style 2: Fade-left */
.anim-style2 { opacity:0; transform:translateX(-20px); transition:all 0.6s ease; }
.anim-style2.in-view { opacity:1; transform:translateX(0); }

/* Style 3: Zoom-in */
.anim-style3 { opacity:0; transform:scale(0.95); transition:all 0.6s ease; }
.anim-style3.in-view { opacity:1; transform:scale(1); }

/* Style 4: Rotate-in */
.anim-style4 { opacity:0; transform:rotate(-5deg); transition:all 0.6s ease; }
.anim-style4.in-view { opacity:1; transform:rotate(0); }

/* Style 5: Slide-right */
.anim-style5 { opacity:0; transform:translateX(20px); transition:all 0.6s ease; }
.anim-style5.in-view { opacity:1; transform:translateX(0); }