/* ===== SCROLL ANIMATIONS ===== */
.fade-up {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity .8s cubic-bezier(.25,.46,.45,.94), transform .8s cubic-bezier(.25,.46,.45,.94);
}
.fade-up.visible {
  opacity: 1;
  transform: translateY(0);
}

.fade-left {
  opacity: 0;
  transform: translateX(-60px);
  transition: opacity .8s cubic-bezier(.25,.46,.45,.94), transform .8s cubic-bezier(.25,.46,.45,.94);
}
.fade-left.visible {
  opacity: 1;
  transform: translateX(0);
}

.fade-right {
  opacity: 0;
  transform: translateX(60px);
  transition: opacity .8s cubic-bezier(.25,.46,.45,.94), transform .8s cubic-bezier(.25,.46,.45,.94);
}
.fade-right.visible {
  opacity: 1;
  transform: translateX(0);
}

.scale-in {
  opacity: 0;
  transform: scale(.85);
  transition: opacity .7s ease, transform .7s ease;
}
.scale-in.visible {
  opacity: 1;
  transform: scale(1);
}

/* Heading separator animation */
.heading-separator {
  transform: scaleX(0);
  transform-origin: center;
  transition: transform .6s cubic-bezier(.25,.46,.45,.94) .3s;
}
.visible .heading-separator,
.fade-up.visible .heading-separator {
  transform: scaleX(1);
}