.slogan-white > span {
  display: inline-block;
  opacity: 0;
  filter: blur(4px);
}

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

.slogan-white > span:nth-child(2) {
  animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.slogan-white > span:nth-child(3) {
  animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.slogan-white > span:nth-child(4) {
  animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.slogan-white > span:nth-child(5) {
  animation: fade-in 0.8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.slogan-white > span:nth-child(6) {
  animation: fade-in 0.8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

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

.second-slogan-white.active > span {
  display: inline-block;
  opacity: 0;
  filter: blur(4px);
}

.second-slogan-white.active > span:nth-child(1) {
  animation: fade-in 0.8s 0.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.second-slogan-white.active > span:nth-child(2) {
  animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.second-slogan-white.active > span:nth-child(3) {
  animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.second-slogan-white.active > span:nth-child(4) {
  animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.second-slogan-white.active > span:nth-child(5) {
  animation: fade-in 0.8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.second-slogan-white.active > span:nth-child(6) {
  animation: fade-in 0.8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

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

.o-que-fazemos > .description > span {
  display: inline-block;
  opacity: 0;
  filter: blur(4px);
}

.o-que-fazemos > .description > span:nth-child(1) {
  animation: fade-in 0.8s 0.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.o-que-fazemos > .description > span:nth-child(2) {
  animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.o-que-fazemos > .description > span:nth-child(3) {
  animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.o-que-fazemos > .description > span:nth-child(4) {
  animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.o-que-fazemos > .description > span:nth-child(5) {
  animation: fade-in 0.8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.o-que-fazemos > .description > span:nth-child(6) {
  animation: fade-in 0.8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.o-que-fazemos > .description > span:nth-child(7) {
  animation: fade-in 0.8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.o-que-fazemos > .description > span:nth-child(8) {
  animation: fade-in 0.8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.o-que-fazemos > .description > span:nth-child(9) {
  animation: fade-in 0.8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

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

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

.char {
  opacity: 0;
  transform: scale(1.5);
  display: inline-block;
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.letter-fade-in .char {
  opacity: 1;
  transform: scale(1);
}

.h2 {
  color: black;
}

.o-que-fazemos > .description {
  transform: scale(2);
  transition: transform 2.5s ease;
}

/* Animation keyframes */
@keyframes slideInRight {
  to {
    right: 10.5%;
  }
}



.o-que-fazemos > .description.active {
  transform: scale(1);
}

.sobre-nos-image > .images > .image-1.active {
  animation: slideInLeft 0.7s ease-out forwards;
}

.sobre-nos-image > .images > .image-1.remove {
  animation: slideOutLeft 0.7s ease-out forwards;
}

.text-video-wrapper {
  opacity: 0;
}

@keyframes fadeSlideInRight {
  from {
    opacity: 0;
    transform: translateX(100%);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes rotating {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.text-video-wrapper.animation {
  animation: fadeSlideInRight 1s ease-out forwards;
}

.text-video.rotating {
  animation: rotating 40s linear infinite;
}

@keyframes slideInLeft {
  from {
    left: -100%;
    opacity: 0;
  }
  to {
    left: 10.5%;
    opacity: 1;
  }
}

@keyframes slideInLeftMobile {
  from {
    left: -100%;
    opacity: 0;
  }
  to {
    left: 0%;
    opacity: 1;
  }
}

@keyframes slideInRightMobile {
  from {
    right: -100%;
  }
  to {
    right: 0%;
  }
}
@keyframes slideInRight {
  from {
    right: -100%;
  }
  to {
    right: 10.5%;
  }
}

@keyframes slideOutLeft {
  from {
    left: 10.5%;
  }
  to {
    left: -100%;
  }
}

@keyframes slideOutRight {
  from {
    right: 10.5%;
  }
  to {
    right: -100%;
  }
}

/* Active (slide in) */
.sobre-nos-image > .images > .image-2.active {
  animation: slideInRight 1s ease-out forwards;
}

/* Remove (slide out) */
.sobre-nos-image > .images > .image-2.remove {
  animation: slideOutRight 1s ease-in forwards;
}

.sobre-nos-image > .images > .image-3.active {
  animation: fade-in 1.1s ease-out forwards;
}

.sobre-nos-image > .images > .image-3.remove {
  animation: fade-out 1.1s ease-out forwards;
}

@keyframes fadeSlideInRight {
  from {
    transform: translateX(200px);
    opacity: 0;
    filter: blur(4px);
  }
  to {
    transform: translateX(0);
    opacity: 1;
    filter: blur(0);
  }
}

.fale-connosco > .container {
  opacity: 0;
  filter: blur(4px);
}

.fale-connosco > .container.animation {
  animation: fade-in 0.5s 0.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

@media screen and (min-width: 1500px) {
  .overlay.animation {
    animation: fadeUp 0.7s ease-out forwards;
    animation-delay: 0.1s; /* Optional delay */
  }

  @keyframes fadeUp {
    from {
      height: 100%; /* Full height at the start */
      top: 0; /* Start at the top */
    }
    to {
      height: 0; /* Shrink to zero height */
      top: 100%; /* Move the overlay upwards */
    }
  }

  .overlay.remove {
    animation: fadeDown 1s ease-out forwards;
    animation-delay: 0.3s; /* Optional delay */
  }

  @keyframes fadeDown {
    from {
      height: 0; /* Full height at the start */
      top: 100%; /* Start at the top */
    }
    to {
      height: 100%; /* Shrink to zero height */
      top: 0; /* Move the overlay upwards */
    }
  }
}

.banner3.animation > p {
  animation: fadeSlideInLeft 0.8s ease-out forwards;
}

@keyframes fadeSlideInLeft {
  from {
    transform: translateX(-300px);
    opacity: 0;
    filter: blur(4px);
  }
  to {
    transform: translateX(0);
    opacity: 1;
    filter: blur(0);
  }
}

.banner3-video.animation {
  animation: fadeSlideInRight 0.8s ease-out forwards;
}

.text-video.animation {
  animation: rotating 40s linear infinite;
}

.slider > .title {
  transform: scale(2);
}

.slider > .title.active {
  transform: scale(1);
  transition: transform 2s ease;
}

.onde-estamos > .container,
.onde-estamos > .container-last {
  opacity: 0;
  filter: blur(4px);
}

.onde-estamos > .container.animation,
.onde-estamos > .container-last.animation {
  animation: fadeSlideUp 0.8s ease-out forwards;
}

@keyframes fadeSlideUp {
  from {
    transform: translateY(-50px);
    opacity: 0;
    filter: blur(4px);
  }
  to {
    transform: translateX(0);
    opacity: 1;
    filter: blur(0);
  }
}

@media screen and (min-width: 1500px) {
  .we-are-and-blue > .title {
    opacity: 0;
    filter: blur(4px);
  }

  .we-are-and-blue > .title.animation {
    animation: fadeSlideUp 0.8s ease-out forwards;
  }
  @keyframes fadeSlideUp {
    from {
      transform: translateY(-50px);
      opacity: 0;
      filter: blur(4px);
    }
    to {
      transform: translateX(0);
      opacity: 1;
      filter: blur(0);
    }
  }

  .we-are-and-blue > .selfie1,
  .we-are-and-blue > .selfie2,
  .we-are-and-blue > .selfie3 {
    opacity: 0;
    filter: blur(4px);
  }

  .we-are-and-blue > .selfie1.animation {
    animation: fadeSlideSelfie1 0.8s ease-out forwards;
  }
  @keyframes fadeSlideSelfie1 {
    from {
      transform: translateX(-200px);
      opacity: 0;
      filter: blur(4px);
    }
    to {
      transform: translateX(0);
      opacity: 1;
      filter: blur(0);
    }
  }

  .we-are-and-blue > .selfie2.animation {
    animation: fadeSlideSelfie2 0.8s ease-out forwards;
  }
  @keyframes fadeSlideSelfie2 {
    from {
      transform: translateY(100px);
      opacity: 0;
      filter: blur(4px);
    }
    to {
      transform: translateX(0);
      opacity: 1;
      filter: blur(0);
    }
  }

  .we-are-and-blue > .selfie3.animation {
    animation: fadeSlideSelfie3 0.8s ease-out forwards;
  }
  @keyframes fadeSlideSelfie3 {
    from {
      transform: translateX(200px);
      opacity: 0;
      filter: blur(4px);
    }
    to {
      transform: translateX(0);
      opacity: 1;
      filter: blur(0);
    }
  }

  .slogan-sobre-nos span {
    opacity: 0;
    filter: blur(4px);
  }

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

  .slogan-sobre-nos.animation span:nth-child(2) {
    animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .slogan-sobre-nos.animation span:nth-child(3) {
    animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .slogan-sobre-nos.animation span:nth-child(4) {
    animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .slogan-sobre-nos.animation span:nth-child(5) {
    animation: fade-in 0.8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .slogan-sobre-nos.animation span:nth-child(6) {
    animation: fade-in 0.8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .slogan-sobre-nos.animation span:nth-child(7) {
    animation: fade-in 0.8s 0.7s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .slogan-sobre-nos.animation span:nth-child(8) {
    animation: fade-in 0.8s 0.8s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .slogan-sobre-nos.animation span:nth-child(9) {
    animation: fade-in 0.8s 0.9s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }
  .slogan-sobre-nos.animation span:nth-child(10) {
    animation: fade-in 0.8s 1s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }
  .slogan-sobre-nos.animation span:nth-child(11) {
    animation: fade-in 0.8s 1.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }
  .slogan-sobre-nos.animation span:nth-child(12) {
    animation: fade-in 0.8s 1.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }
  .slogan-sobre-nos.animation span:nth-child(13) {
    animation: fade-in 0.8s 1.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }
  .slogan-sobre-nos.animation span:nth-child(14) {
    animation: fade-in 0.8s 1.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .biografia > .container > .imagem1,
  .biografia > .container > .imagem2,
  .biografia > .container > .name1 span,
  .biografia > .container > .name2 span,
  .biografia > .container > .title1 span,
  .biografia > .container > .title2 span,
  .biografia > .container > .description1,
  .biografia > .container > .description2 {
    opacity: 0;
    filter: blur(4px);
  }

  .biografia > .container > .imagem1.animation {
    animation: fadeSlideImage1 1s ease-out forwards;
  }

  .biografia > .container > .imagem2.animation {
    animation: fadeSlideImage2 1s ease-out forwards;
  }
  @keyframes fadeSlideImage2 {
    from {
      transform: translateX(100px);
      opacity: 0;
      filter: blur(4px);
    }
    to {
      transform: translateX(0);
      opacity: 1;
      filter: blur(0);
    }
  }

  @keyframes fadeSlideImage1 {
    from {
      transform: translateX(-100px);
      opacity: 0;
      filter: blur(4px);
    }
    to {
      transform: translateX(0);
      opacity: 1;
      filter: blur(0);
    }
  }

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

  .biografia > .container > .name2.animation span:nth-child(2) {
    animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

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

  .biografia > .container > .name1.animation span:nth-child(2) {
    animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .biografia > .container > .name1.animation span:nth-child(3) {
    animation: fade-in 0.8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

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

  .biografia > .container > .title1.animation span:nth-child(2) {
    animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .biografia > .container > .title1.animation span:nth-child(1) {
    animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .biografia > .container > .title1.animation span:nth-child(2) {
    animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .biografia > .container > .title1.animation span:nth-child(3) {
    animation: fade-in 0.8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

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

  .biografia > .container > .title2.animation span:nth-child(2) {
    animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .biografia > .container > .title2.animation span:nth-child(3) {
    animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .biografia > .container > .title2.animation span:nth-child(4) {
    animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }

  .biografia > .container > .description2.animation {
    animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }
  .biografia > .container > .description1.animation {
    animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
  }
}
.faq-item {
  opacity: 0;
  filter: blur(4px);
}

@keyframes fadeSlideFaq {
  from {
    transform: translateY(-10px);
    opacity: 0;
    filter: blur(4px);
  }
  to {
    transform: translateX(0);
    opacity: 1;
    filter: blur(0);
  }
}

.faq-container .faq-item:nth-child(1) {
  animation: fadeSlideFaq 0.4s 0.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.faq-container .faq-item:nth-child(2) {
  animation: fadeSlideFaq 0.5s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.faq-container .faq-item:nth-child(3) {
  animation: fadeSlideFaq 0.6s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.faq-container .faq-item:nth-child(4) {
  animation: fadeSlideFaq 0.7s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.faq-container .faq-item:nth-child(5) {
  animation: fadeSlideFaq 0.8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.faq-container .faq-item:nth-child(6) {
  animation: fadeSlideFaq 0.9s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

@media only screen and (max-width: 480px) {
    .o-que-fazemos > .description > span {
      display: inline-block;
      opacity: 0;
      filter: blur(0);
    }
    
    .sobre-nos-image > .images > .image-1.active {
        animation: slideInLeftMobile 0.7s ease-out forwards;
    }
    
    .sobre-nos-image > .images > .image-2.active {
        animation: slideInRightMobile 1s ease-out forwards;
    }

    
    

}