/* Motion treatment for the RFE landing page. */
.rfe-motion-ready .hero {
  animation: rfeHeroDrift 16s ease-in-out infinite alternate;
}

.rfe-motion-ready .hero .copy > * {
  opacity: 0;
  transform: translate3d(0, 22px, 0);
  animation: rfeHeroEnter .72s cubic-bezier(.2,.8,.2,1) forwards;
}

.rfe-motion-ready .hero .copy > :nth-child(1) { animation-delay: .08s; }
.rfe-motion-ready .hero .copy > :nth-child(2) { animation-delay: .16s; }
.rfe-motion-ready .hero .copy > :nth-child(3) { animation-delay: .25s; }
.rfe-motion-ready .hero .copy > :nth-child(4) { animation-delay: .34s; }
.rfe-motion-ready .hero .copy > :nth-child(5) { animation-delay: .43s; }

.rfe-reveal {
  opacity: 0;
  transform: translate3d(0, 34px, 0);
  transition:
    opacity .76s cubic-bezier(.2,.8,.2,1) var(--rfe-delay, 0ms),
    transform .76s cubic-bezier(.2,.8,.2,1) var(--rfe-delay, 0ms);
  will-change: opacity, transform;
}

.rfe-reveal[data-rfe-direction="left"] { transform: translate3d(-38px, 18px, 0); }
.rfe-reveal[data-rfe-direction="right"] { transform: translate3d(38px, 18px, 0); }
.rfe-reveal.rfe-visible { opacity: 1; transform: translate3d(0, 0, 0); will-change: auto; }

.rfe-motion-ready .card,
.rfe-motion-ready .pricebox,
.rfe-motion-ready .faq details {
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.rfe-motion-ready .card:hover,
.rfe-motion-ready .pricebox:hover,
.rfe-motion-ready .faq details:hover {
  transform: translateY(-5px);
  border-color: #a9d6f5;
  box-shadow: 0 20px 44px rgba(18,59,101,.14);
}

.rfe-motion-ready .photo-panel,
.rfe-motion-ready .alice-image {
  transition: transform .65s cubic-bezier(.2,.8,.2,1), box-shadow .4s ease;
}

.rfe-motion-ready .image-feature:hover .photo-panel,
.rfe-motion-ready .split:hover .alice-image {
  transform: scale(1.025);
  box-shadow: 0 24px 54px rgba(18,59,101,.2);
}

.rfe-motion-ready .btn { transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease; }
.rfe-motion-ready main .btn:hover { transform: translateY(-2px); box-shadow: 0 14px 28px rgba(8,118,223,.24); }

@keyframes rfeHeroEnter {
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes rfeHeroDrift {
  from { background-position: 50% 50%; }
  to { background-position: 53% 50%; }
}

@media (max-width: 767px) {
  .rfe-reveal,
  .rfe-reveal[data-rfe-direction="left"],
  .rfe-reveal[data-rfe-direction="right"] {
    transform: translate3d(0, 16px, 0);
    transition-duration: .5s;
  }
  .rfe-motion-ready .card:hover,
  .rfe-motion-ready .pricebox:hover,
  .rfe-motion-ready .faq details:hover,
  .rfe-motion-ready .image-feature:hover .photo-panel,
  .rfe-motion-ready .split:hover .alice-image,
  .rfe-motion-ready main .btn:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .rfe-motion-ready .hero,
  .rfe-motion-ready .hero .copy > *,
  .rfe-reveal,
  .rfe-reveal[data-rfe-direction="left"],
  .rfe-reveal[data-rfe-direction="right"] {
    animation: none !important;
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}