/* Fold 1 - Image Animation */
.animate.fold-1 .f1-bg-image {
  transition: all 0.5s ease;
  transform: translateX(2000px);
}

.animate.animate-complete.fold-1 .f1-bg-image {
  transform: translateX(0);
}

/* Fold 1 - Infographic Animations */
.animate.f1-infographic .ii-1 {
  transition: all 2s ease;
  transform: translateX(-4000px);
}
.animate.f1-infographic .ii-2 {
  transition: all 1.5s ease;
  transform: translateX(-4000px);
}
.animate.f1-infographic .ii-3 {
  transition: all 1s ease;
  transform: translateX(-4000px);
}
.animate.f1-infographic .ii-4 {
  transition: all 0.5s ease;
  transform: translateX(-4000px);
}

.animate.animate-complete.f1-infographic .ii-1 {
  transform: translateX(0);
}
.animate.animate-complete.f1-infographic .ii-2 {
  transform: translateX(0);
}
.animate.animate-complete.f1-infographic .ii-3 {
  transform: translateX(0);
}
.animate.animate-complete.f1-infographic .ii-4 {
  transform: translateX(0);
}

/* Fold 1 - Content Animation */
.animate.fold-1 .f1-content-inner {
  transition: all 0.5s ease;
  transform: translateX(-1000px);
}

.animate.animate-complete.fold-1 .f1-content-inner {
  transform: translateX(0);
}

/* Fold 2 - Image Animation */
.animate.fold-2 .f2-bg-image {
  transition: all 0.5s ease;
  transform: translateX(-2000px);
}

.animate.animate-complete.fold-2 .f2-bg-image {
  transform: translateX(0);
}

/* Fold 2 - Content Animation */
.animate.fold-2 .f2-content-inner {
  transition: all 0.5s ease;
  transform: translateX(1000px);
}

.animate.animate-complete.fold-2 .f2-content-inner {
  transform: translateX(0);
}

/* Fold 3 - Animation */
.animate.fold-3 .title {
  transition: all 0.5s ease;
  transform: translateY(-1000px);
}
.animate.fold-3 .commercial-link {
  transition: all 0.5s ease;
  transform: translateX(-1000px);
}
.animate.fold-3 .residential-link {
  transition: all 0.5s ease;
  transform: translateX(1000px);
}

.animate.animate-complete.fold-3 .title {
  transition: all 0.5s ease;
  transform: translateY(0);
}
.animate.animate-complete.fold-3 .commercial-link {
  transition: all 0.5s ease;
  transform: translateX(0);
}
.animate.animate-complete.fold-3 .residential-link {
  transition: all 0.5s ease;
  transform: translateX(0);
}

/* Fold 4 - Animation */
.animate.fold-4 .title {
  transition: all 0.5s ease;
  transform: translateY(1000px);
}
.animate.animate-complete.fold-4 .title {
  transform: translateY(0);
}

.animate.fold-4 .product-carousel {
  transition: all 0.5s ease;
  transform: translateY(1500px);
}
.animate.animate-complete.fold-4 .product-carousel {
  transform: translateY(0);
}

/* Fold 6 - Animation */
.animate.fold-6 .f6-bg-image {
  transition: all 0.5s ease;
  transform: translateX(-1500px);
}

.animate.animate-complete.fold-6 .f6-bg-image {
  transform: translateX(0);
}

.animate.fold-6 .f6-content-inner {
  transition: all 0.5s ease;
  transform: translateX(1500px);
}

.animate.animate-complete.fold-6 .f6-content-inner {
  transform: translateX(0);
}