.anim {
  opacity: 0;
  transition: all 0.5s ease;
}

@media screen and (min-width: 320px) {


    /* FADES COM TRANSLATE */
    .fade-in-top     { transform: translateY(-30px); }
    .fade-in-bottom  { transform: translateY(30px); }
    .fade-in-left    { transform: translateX(-30px); }
    .fade-in-right   { transform: translateX(30px); }

    .fade-in-top.start,
    .fade-in-bottom.start,
    .fade-in-left.start,
    .fade-in-right.start {
      opacity: 1;
      transform: translate(0, 0);
    }

    .fade-out-top.start     { opacity: 0; transform: translateY(-30px); }
    .fade-out-bottom.start  { opacity: 0; transform: translateY(30px); }
    .fade-out-left.start    { opacity: 0; transform: translateX(-30px); }
    .fade-out-right.start   { opacity: 0; transform: translateX(30px); }

    /* FADES SEM TRANSLATE */
    .fade-only.start {
      opacity: 1;
    }

}


@media screen and (min-width: 1024px) {


    /* FADES COM TRANSLATE */
    .fade-in-top     { transform: translateY(-60px); }
    .fade-in-bottom  { transform: translateY(60px); }
    .fade-in-left    { transform: translateX(-60px); }
    .fade-in-right   { transform: translateX(60px); }

    .fade-in-top.start,
    .fade-in-bottom.start,
    .fade-in-left.start,
    .fade-in-right.start {
      opacity: 1;
      transform: translate(0, 0);
    }

    .fade-out-top.start     { opacity: 0; transform: translateY(-60px); }
    .fade-out-bottom.start  { opacity: 0; transform: translateY(60px); }
    .fade-out-left.start    { opacity: 0; transform: translateX(-60px); }
    .fade-out-right.start   { opacity: 0; transform: translateX(60px); }

    /* FADES SEM TRANSLATE */
    .fade-only.start {
      opacity: 1;
    }

}

.fade-blur {
  filter: blur(8px);
  transition: opacity 0.4s ease, filter 0.4s ease;
}
.fade-blur.start {
  opacity: 1;
  filter: blur(0);
}

.fade-scale {
  transform: scale(0.98);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.fade-scale.start {
  opacity: 1;
  transform: scale(1);
}

.fade-glow {
  filter: brightness(120%);
  transition: opacity 0.4s ease, filter 0.4s ease;
}
.fade-glow.start {
  opacity: 1;
  filter: brightness(100%);
}

.fade-clip {
  clip-path: inset(0 0 100% 0);
  transition: opacity 0.4s ease, clip-path 0.4s ease;
}
.fade-clip.start {
  opacity: 1;
  clip-path: inset(0 0 0 0);
}

.fade-text-spacing {
  letter-spacing: 5px;
  transition: opacity 0.5s ease, letter-spacing 0.5s ease;
}
.fade-text-spacing.start {
  opacity: 1;
  letter-spacing: 0;
}

/* ZOOM corrigido */
.zoom-in {
  opacity: 0;
  transform: scale(0.7);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.zoom-in.start {
  opacity: 1;
  transform: scale(1);
}

.zoom-out {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.zoom-out.start {
  opacity: 0;
  transform: scale(0.7);
}