@media screen and (min-width: 1170px) {
  .header .container-text span,
  .header .container-text p {
    display: inline-block;
    opacity: 0;
    filter: blur(4px);
  }

  .header .container-text span:nth-child(1) {
    animation: fade-in 0.8s 0.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .header .container-text p:nth-child(1) {
    animation: fade-in 0.8s 0.9s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  @keyframes fade-in {
    100% {
      opacity: 1;
      filter: blur(0);
    }
  }

  /* Animation keyframes */
  @keyframes slideInRight {
    from {
      transform: translateX(100%);
    }
    to {
      transform: translateX(0);
    }
  }

  @keyframes slideInLeft {
    from {
      margin-left: 0;
      opacity: 0;
    }
    to {
      opacity: 1;
      margin-left: 300px;
    }
  }

  .about .about-text.animation {
    animation: slideInRight 1s ease-out forwards;
  }

  .imagem-about.animation {
    animation: slideInLeft 1s ease-out forwards;
  }

  .answers .first-row div,
  .answers .second-row div {
    opacity: 0;
  }

  .answers .first-row.animation div {
    animation: fadeDown 1s ease-out forwards;
  }

  @keyframes fadeDown {
    from {
      opacity: 0;
      margin-top: -100px; /* Full height at the start */
    }
    to {
      opacity: 1;
      margin-top: 0; /* Shrink to zero height */
    }
  }

  .answers .second-row.animation div {
    animation: fadeDown 1.8s ease-out forwards;
  }

  .steps > .first-row > div,
  .steps > .second-row > div,
  .saber-mais-sessao {
    opacity: 0;
    filter: blur(4px);
  }

  .steps > .first-row.animation > div:nth-child(1) {
    animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .steps > .first-row.animation > div:nth-child(2) {
    animation: fade-in 0.8s 0.8s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .steps > .second-row.animation > div:nth-child(1) {
    animation: fade-in 0.8s 1.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .saber-mais-sessao.animation {
    animation: fade-in 0.8s 1.8s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  @keyframes fadeDownServicos {
    from {
      opacity: 0;
      transform: translateY(-50px);
    }
    to {
      opacity: 1;
      transform: translateY(0px);
    }
  }

  .os-nossos-servicos.animation .grid ul li:nth-child(1) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.5s;
  }

  .os-nossos-servicos.animation .grid ul li:nth-child(2) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.8s;
  }

  .os-nossos-servicos.animation .grid ul li:nth-child(3) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.1s;
  }

  .os-nossos-servicos.animation .grid ul li:nth-child(4) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.4s;
  }
  .os-nossos-servicos.animation .grid ul li:nth-child(5) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.7s;
  }

  .os-nossos-servicos.animation .marcacao-container {
    animation: fade-in 0.8s ease-out forwards;
    animation-delay: 2s;
  }
  .os-nossos-servicos .grid ul li,
  .os-nossos-servicos .marcacao-container,
  .radiestesia > div > .title,
  .radiestesia .arrow,
  .radiestesia .texto1,
  .radiestesia .texto2,
  .radiestesia .grid .container1 .texto,
  .radiestesia .grid .container2 .texto,
  .radiestesia .grid .container1 .title,
  .radiestesia .grid .container2 .title,
  .radiestesia .grid .container1 .lista li,
  .radiestesia .grid .container2 .lista li,
  .como-funciona-page .title,
  .como-funciona-page .marcacao-container,
  .como-funciona-page .arrow,
  .como-funciona-page .texto1,
  .como-funciona-page .texto2,
  .bola1,
  .bola2,
  .bola3,
  .bola4,
  .servicos-page .grid ul li,
  .servicos-page .title,
  .servicos-page .arrow {
    opacity: 0;
  }

  .radiestesia > div > .title {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.5s;
  }

  .radiestesia .arrow {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.7s;
  }

  .radiestesia .texto1 {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.9s;
  }

  .radiestesia .texto2 {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.1s;
  }

  .radiestesia .grid.animation .container1 .title,
  .radiestesia .grid.animation .container2 .title {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.5s;
  }

  .radiestesia .grid .container1.animation .texto,
  .radiestesia .grid .container2.animation .texto {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.7s;
  }

  .radiestesia .grid .container1 .lista.animation li:nth-child(1),
  .radiestesia .grid .container2 .lista.animation li:nth-child(1) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.9s;
  }
  .radiestesia .grid .container1 .lista.animation li:nth-child(2),
  .radiestesia .grid .container2 .lista.animation li:nth-child(2) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.1s;
  }
  .radiestesia .grid .container1 .lista.animation li:nth-child(3),
  .radiestesia .grid .container2 .lista.animation li:nth-child(3) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.3s;
  }
  .radiestesia .grid .container1 .lista.animation li:nth-child(4),
  .radiestesia .grid .container2 .lista.animation li:nth-child(4) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.5s;
  }
  .radiestesia .grid .container1 .lista.animation li:nth-child(5),
  .radiestesia .grid .container2 .lista.animation li:nth-child(5) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.7s;
  }
  .radiestesia .grid .container1 .lista.animation li:nth-child(6),
  .radiestesia .grid .container2 .lista.animation li:nth-child(6) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.9s;
  }

  .como-funciona-page .title {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.5s;
  }

  .como-funciona-page .marcacao-container {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.7s;
  }

  .como-funciona-page .arrow {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.9s;
  }

  .como-funciona-page .texto1 {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.9s;
  }

  .como-funciona-page .texto2 {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.1s;
  }

  .bola1.animation {
    animation: fade-in 1.2s ease-out forwards;
    animation-delay: 0.5s;
  }

  .bola2.animation {
    animation: fade-in 1.2s ease-out forwards;
    animation-delay: 1s;
  }

  .bola3.animation {
    animation: fade-in 1.2s ease-out forwards;
    animation-delay: 1.5s;
  }

  .bola4.animation {
    animation: fade-in 1.2s ease-out forwards;
    animation-delay: 2s;
  }

  .servicos-page .grid ul li:nth-child(1) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1s;
  }

  .servicos-page .title {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.5s;
  }
  .servicos-page .arrow {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 0.7s;
  }
  .servicos-page .grid ul li:nth-child(2) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.2s;
  }
  .servicos-page .grid ul li:nth-child(3) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.5s;
  }
  .servicos-page .grid ul li:nth-child(4) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.7s;
  }
  .servicos-page .grid ul li:nth-child(5) {
    animation: fadeDownServicos 0.8s ease-out forwards;
    animation-delay: 1.9s;
  }
}

@media screen and (max-width: 1680px) {
  @keyframes slideInLeft {
    from {
      margin-left: 0;
      opacity: 0;
    }
    to {
      opacity: 1;
      margin-left: 180px;
    }
  }
}