.landing-hero-title,
.landing-hero-copy {
  animation: landing-hero-text-in 2200ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.landing-hero-button {
  animation: landing-hero-in 1600ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.landing-hero-copy {
  animation-delay: 260ms;
}

.landing-hero-button {
  animation-delay: 720ms;
}

.landing-hero-ticker-track {
  animation: landing-ticker-scroll 34s linear infinite;
}

.landing-reveal {
  --reveal-y: 16px;
  --reveal-scale: 0.985;
  --reveal-blur: 8px;
  --reveal-opacity-duration: 820ms;
  --reveal-transform-duration: 980ms;
  --reveal-filter-duration: 820ms;
  opacity: 0;
  filter: blur(var(--reveal-blur));
  transform: translate3d(0, var(--reveal-y), 0) scale(var(--reveal-scale));
  transition:
    opacity var(--reveal-opacity-duration) cubic-bezier(0.16, 1, 0.3, 1),
    transform var(--reveal-transform-duration) cubic-bezier(0.16, 1, 0.3, 1),
    filter var(--reveal-filter-duration) cubic-bezier(0.16, 1, 0.3, 1);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform, filter;
}

.landing-reveal.is-visible {
  opacity: 1;
  filter: blur(0);
  transform: translate3d(0, 0, 0) scale(1);
}

.landing-pencil-image-card img,
.landing-success-photo {
  transition: transform 560ms cubic-bezier(0.16, 1, 0.3, 1);
}

.landing-system-star,
.landing-output-phone,
.landing-action-media,
.landing-pencil-image-card img,
.landing-action-media img {
  transition: transform 160ms linear;
  will-change: transform;
}

.landing-system-star {
  transform: translate3d(0, var(--depth-y, 0px), 0) rotate(var(--depth-rotate, 0deg));
}

.landing-output-phone {
  transform: translate3d(0, var(--depth-y, 0px), 0) rotate(var(--depth-rotate, 0deg));
}

.landing-pencil-image-card img {
  transform: translate3d(0, var(--depth-y, 0px), 0) scale(1.001);
}

.landing-action-media {
  transform: translate3d(0, var(--depth-y, 0px), 0) rotate(var(--depth-rotate, 0deg));
}

.landing-action-media img {
  transition: transform 160ms linear;
  transform: translate3d(0, var(--depth-y-soft, 0px), 0) rotate(calc(-3deg + var(--depth-rotate-soft, 0deg)));
  will-change: transform;
}

.landing-hero2-card,
.landing-system-card,
.landing-pricing-card,
.landing-success-card {
  transition:
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1),
    box-shadow 360ms cubic-bezier(0.16, 1, 0.3, 1);
  will-change: transform, box-shadow;
}

.landing-hero2-card img,
.landing-system-card img,
.landing-success-avatar,
.landing-pricing-card .landing-action-underline,
.landing-faq-item summary,
.landing-faq-toggle,
.landing-faq-spark,
.landing-faq-item p,
.landing-hero-button .quiz-submit-plus,
.landing-problem-button .quiz-submit-plus,
.landing-pencil-button .quiz-submit-plus,
.landing-action-button .quiz-submit-plus,
.landing-pricing-button .quiz-submit-plus,
.landing-footer-button .quiz-submit-plus {
  transition:
    transform 320ms cubic-bezier(0.16, 1, 0.3, 1),
    background-color 240ms ease,
    color 240ms ease,
    box-shadow 320ms cubic-bezier(0.16, 1, 0.3, 1);
}

.landing-hero-button .quiz-submit-plus,
.landing-problem-button .quiz-submit-plus,
.landing-pencil-button .quiz-submit-plus,
.landing-action-button .quiz-submit-plus,
.landing-pricing-button .quiz-submit-plus,
.landing-footer-button .quiz-submit-plus {
  position: absolute;
  right: 20px;
  top: 50%;
  display: grid;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  line-height: 0;
  transform: translateY(-50%);
  transform-origin: 50% 50%;
}

.landing-hero-button .quiz-submit-plus .icon-svg,
.landing-problem-button .quiz-submit-plus .icon-svg,
.landing-pencil-button .quiz-submit-plus .icon-svg,
.landing-action-button .quiz-submit-plus .icon-svg,
.landing-pricing-button .quiz-submit-plus .icon-svg,
.landing-footer-button .quiz-submit-plus .icon-svg {
  display: block;
  transform: none;
}

.landing-faq-item[open] p {
  animation: landing-faq-answer-in 360ms cubic-bezier(0.16, 1, 0.3, 1);
}

@media (hover: hover) and (pointer: fine) {
  .landing-hero2-card:hover,
  .landing-system-card:hover,
  .landing-pricing-card:hover,
  .landing-success-card:hover {
    transform: translate3d(0, -8px, 0);
  }

  .landing-hero2-card:hover img {
    transform: scale(1.035);
  }

  .landing-system-card:hover img {
    transform: translateX(-50%) translateY(-10px) scale(1.03);
  }

  .landing-pencil-image-card:hover img {
    transform: translate3d(0, var(--depth-y, 0px), 0) scale(1.03);
  }

  .landing-action-media:hover img {
    transform: translate3d(0, var(--depth-y-soft, 0px), 0) rotate(calc(-4deg + var(--depth-rotate-soft, 0deg))) scale(1.025);
  }

  .landing-success-card:hover .landing-success-photo {
    transform: translate3d(0, -4px, 0) scale(1.025);
  }

  .landing-success-card:hover .landing-success-avatar {
    transform: translate3d(0, -4px, 0) scale(1.035);
  }

  .landing-pricing-card:hover .landing-action-underline {
    transform: translate3d(0, -2px, 0) scale(1.03);
  }

  .landing-faq-item summary:hover {
    transform: translate3d(0, -3px, 0);
    box-shadow: 0 18px 32px -24px rgba(54, 51, 29, 0.35);
  }

  .landing-faq-item:hover .landing-faq-toggle {
    transform: rotate(90deg) scale(1.05);
  }

  .landing-faq-item:hover .landing-faq-spark {
    transform: rotate(12deg) scale(1.08);
  }

}

@keyframes landing-hero-in {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes landing-hero-text-in {
  from {
    opacity: 0;
    letter-spacing: 0.045em;
    transform: translateY(12px) scale(0.985);
  }

  58% {
    opacity: 1;
  }

  to {
    opacity: 1;
    letter-spacing: 0;
    transform: translateY(0) scale(1);
  }
}

@keyframes landing-ticker-scroll {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

@keyframes landing-faq-answer-in {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .landing-hero-title,
  .landing-hero-copy,
  .landing-hero-button,
  .landing-hero-ticker-track,
  .landing-reveal {
    animation: none;
    opacity: 1;
    filter: none;
    transform: none;
    transition: none;
  }

  .landing-system-star,
  .landing-output-phone,
  .landing-action-media,
  .landing-pencil-image-card img,
  .landing-action-media img,
  .landing-hero2-card,
  .landing-system-card,
  .landing-pricing-card,
  .landing-success-card,
  .landing-hero2-card img,
  .landing-system-card img,
  .landing-success-avatar,
  .landing-success-photo,
  .landing-pricing-card .landing-action-underline,
  .landing-faq-item summary,
  .landing-faq-toggle,
  .landing-faq-spark,
  .landing-faq-item p,
  .landing-hero-button .quiz-submit-plus,
  .landing-problem-button .quiz-submit-plus,
  .landing-pencil-button .quiz-submit-plus,
  .landing-action-button .quiz-submit-plus,
  .landing-pricing-button .quiz-submit-plus,
  .landing-footer-button .quiz-submit-plus {
    animation: none;
    transition: none;
  }

  .landing-pencil-image-card:hover img,
  .landing-action-media:hover img,
  .landing-success-card:hover .landing-success-photo {
    transform: inherit;
  }
}
